首页 > 解决方案 > React - 使用 usestate 钩子推送数组

问题描述

我正在制作“加载更多”,每次单击按钮时都会从后端获取 10 个项目。

我不明白我正面临这个基本但奇怪的问题。

问题(示例)

const [ projectArray, setProjectArray ] = useState([ { id: 1 } ]) // original state
//
const { data } = await axios.get(`/api/project/explore/${page}`);
console.log(data); // returns array of objects 
if (data.length > 0) {
   setProjectArray(array => [...array, data]);
}
console.log(projectArray) 
// This^^ returns >>> [ {id: 1}, [ { id: 2 }, { id: 3 }] ]

标签: javascriptreactjsrxjs

解决方案


数据也是一个数组,所以你也应该扩展它

   setProjectArray(array => [...array, ...data]);

推荐阅读