我正在获取数据，但数组长度返回为0

Question

我正在尝试从Firebase抓取数据，并且它的控制台日志正确，但是数组显示长度为0

useEffect(() => {
    let items = [];
    const unsubscribe = store
      .collection('users')
      .doc(user.uid)
      .collection('redirects')
      .onSnapshot(snapShot => {
        snapShot.forEach(getPath => {
          const { path } = getPath.data();
          store.doc(path).onSnapshot(doc => {
            const data = doc.data();
            items.push({ ...data });
          });
        });
      });
    setDocs(items);
    setIsLoading(false);
    return () => unsubscribe();
  }, []);

  console.log(docs);

Answer 1

尝试这样的事情：

您的setState调用应该在onSnapShot(()=>{})回调内部，因为它是异步的。这样，您基本上是在尝试使用空的setDocs()数组调用items。

useEffect(() => {
    let items = [];
    const unsubscribe = store
      .collection('users')
      .doc(user.uid)
      .collection('redirects')
      .onSnapshot(snapShot => {
        snapShot.forEach(getPath => {
          const { path } = getPath.data();
          store.doc(path).onSnapshot(doc => {
            const data = doc.data();
            items.push({ ...data });
          });
        });
        setDocs(items);
        setIsLoading(false);
      });
    //setDocs(items);
    //setIsLoading(false);
    return () => unsubscribe();
  }, []);

Answer 2

正如其他人所提到的，这似乎是一个异步问题。 chrome控制台将显示已解析的对象值，不一定显示它们在运行时的值。 为了说明您的意思，请将控制台日志从console.log(docs)更改为console.log(JSON.stringify(docs))，它将在运行时向您显示docs的字符串值，该字符串值应该是一个空数组，这将使长度为0是有意义的（因为在异步调用得到解决之前为0）。