javascript - 无法获取对象/数组大小

Question

背景:我正在使用reactjs，我的目标是获取存储在firestore中的数据

我有一个空数组，我要添加到其中，然后返回该数组

从“firebase/app”导入firebase 导入“firebase/存储” 导入“firebase/firestore”

class firebaseclass {
  constructor() {
    if (firebase.apps.length === 0) {
      firebase.initializeApp(firebaseConfig);
    }
  }

  getfirestore() {
    const db = firebase.firestore();
    var storearray = []
    db.collection("data").get().then(function (querySnapshot) {
      querySnapshot.forEach(function (doc) {
        storearray.push(doc.data())
     });
    });
    return storearray
  }
}

export default new firebaseclass

在我的主页中，我这样调用该函数

function App() {
  const [names, setnames] = useState({
  })

  var datadata = firebaseclass.getfirestore();
  console.log(datadata, "datadatadata")

  return (
    <div className="App">
    </div>
  );
}

export default App;

这是控制台日志结果

[]
0: {hasstart: false, lat: ******, long: *******, name: "***", postalcode: ******, …}
1: {hasstart: false, lat: ******, long: ******, name: "chias crib", postalcode: ******, …}
2: {hasstart: false, lat: "test3", long: "test3", postalcode: 3, powerlevel: 3, …}
length: 3
__proto__: `Array(0)


"data data data"`

如您所见，我收到了某种形式的结果

当我

console.log(typeof(datadata), "data data data");

我收到

object data data data

这很奇怪，因为我之前返回了一个数组

最后，当我尝试

  console.log(datadata.length, "data data data");

我收到

0 "data data data"

我也尝试过

var size = Object.keys(datadata).length;


console.log(size, "datadatadata")

但是我已经收到了

0 "datadatadata"

我也尝试过将空数组改为对象，并返回一个对象而不是数组，但上述方法仍然不起作用。我在这里做错了什么？

Answer 1

您的问题是每次都返回一个空数组，因为添加到数组中的部分是异步完成的。

getfirestore() {
    const db = firebase.firestore();
    var storearray = []

    // THIS PART RUNS ASYNC.
    db.collection("data").get().then(function (querySnapshot) {
      querySnapshot.forEach(function (doc) {
        storearray.push(doc.data()). //. << ------ THIS IS CALLED SECOND
     });
    });

    return storearray // <<------- THIS IS CALLED FIRST
}

您必须返回回调、 promise 或使用async/await

更新异步/等待方法应该是这样的:

async getfirestore() {
    const db = firebase.firestore();
    const storearray = [];

    const querySnapshot = await db.collection("data").get();
    querySnapshot.forEach(doc =>  { storearray.push(doc.data()) });

    return storearray;
}

然后在您的应用程序中:

async function App() {
  const [names, setnames] = useState({
  })

  var datadata = await firebaseclass.getfirestore();
  console.log(datadata, "datadatadata")
...