如何读取 javascript 中对象的 属性？

Question

您好！

我正在使用 React 和 React 上下文 API。我有整个应用程序的 App.js 组件。它是功能组件。其中'有上下文的状态（useState）：

const [contextValue, setContextValue] = useState(null)

和useEffect：

useEffect(() => {
    const wrapper = async () => {
      let data = {};

      const fetchData = () => {
        fetchAbout().then((res) => (data.about = res.data));
        fetchNews().then((res) => (data.news = res.data));
        fetchArticles().then((res) => (data.articles = res.data));
        fetchOffer().then((res) => (data.offer = res.data));
        fetchPortfolio().then((res) => (data.portfolio = res.data));
        fetchQuestions().then((res) => (data.questions = res.data));
      };
      await fetchData();

      console.log(data);
      console.log(data.about);

      setContextValue(data);
    };

    wrapper();
  }, []);

---

所以在 fetchData 函数中，我正在创建 data 对象的属性。 所以在await fetchData()之后，有2条控制台日志。正如预期的那样，首先是记录数据对象及其字段：

---

但是 console.log(data.about); 有问题，因为它正在记录 undefined!。 我预计，它将是数据对象中 about 字段的值（如第一个 console.log）

提前致谢

Answer 1

fetchData 没有返回承诺，因此您不能“等待”它。 到您 console.log(data.about) 时，数据尚未填充。 你可以通过

解决

  const fetchData = () => {
    return Promise.all([
       fetchAbout().then((res) => (data.about = res.data)),
       fetchNews().then((res) => (data.news = res.data)),
       fetchArticles().then((res) => (data.articles = res.data)),
       fetchOffer().then((res) => (data.offer = res.data)),
       fetchPortfolio().then((res) => (data.portfolio = res.data)),
       fetchQuestions().then((res) => (data.questions = res.data)),
    ])
  };