如何更新数组中的 object

Question

如何将数据放入 javaScript 的数组中的 object 值中？ 我正在使用 axios 和 useEffect 挂钩从后端获取数据！ 获取数据我需要将该数据推送到阵列内部的 object 中！ 我写的代码不起作用而且无知！ 有一个JS问题！

const Articles = () => {


 const [articleData, setArticleData] = useState([]);

 useEffect(() => {
    const fetchBlogs = async () => {
      try {
        const res = await axios.get(
          `${process.env.REACT_APP_API_URL}/article/list/all`
        );
        setArticleData(res.data);
      } catch (err) {}
    };
    fetchBlogs();
  }, []);


  for (let article in articleData) {
   
      data: [
        {
          key: article._id,
          title: article.title,
          author_username: article.author_username,
          category: article.category_name,
          subcategory: article.subCategory_name,
          publication_date: article.publication,
        },
      ],
   
  }


return (
  <div className='articles'>
     <Table
        columns={columns}
        dataSource={data}
        size='large'
      />
  </div>

)

};

Answer 1

您可以使用 map 获取新数组，然后将其保存到 state 并使用 JSX 中的 state 变量。 像这样的东西应该适合你

const Articles = () => {


 const [articleData, setArticleData] = useState([]);

 useEffect(() => {
    const fetchBlogs = async () => {
      try {
        const res = await axios.get(
          `${process.env.REACT_APP_API_URL}/article/list/all`
        );
        setArticleData(res.data.map(article => ({
          key: article._id,
          title: article.title,
          author_username: article.author_username,
          category: article.category_name,
          subcategory: article.subCategory_name,
          publication_date: article.publication,
        })));
      } catch (err) {}
    };
    fetchBlogs();
  }, []);


return (
  <div className='articles'>
     <Table
        columns={columns}
        dataSource={articleData}
        size='large'
      />
  </div>

)

};