【问题标题】:How to add JSON objects to array state in functional component in react.js如何在 react.js 的功能组件中将 JSON 对象添加到数组状态
【发布时间】:2021-10-28 06:56:57
【问题描述】:

在使用map 方法时,我需要将所有来自 axios 的 JSON 形式的信息保持在状态中。

问题是当我在 axios 请求之后使用map 方法时,它只是将最后一个 JSON 添加到状态,但我的 JSON 中有 9 个对象

const [expensesData , setExpensesData] = useState([])

useEffect(() => {
    axios.get('API-address')
    .then(res => {
        res.data.map( info => {
            setExpensesData(
                [
                    ...expensesData,
                    {info}
                ]
            )
        })
    })
    .catch(e => console.log(e))
} , [])

【问题讨论】:

    标签: reactjs arraylist setstate


    【解决方案1】:
    const [expensesData , setExpensesData] = useState([])
    
    useEffect(() => {
        axios.get('API-address')
        .then(res => {
            setExpensesData(res.data);
        })
        .catch(e => console.log(e))
    } , [])
    

    【讨论】:

      【解决方案2】:

      最后一行将提高您应用程序的应用程序性能 它会在你的费用数据时调用渲染方法

          const [expensesData , setExpensesData] = useState([])
          
          useEffect(() => {
              axios.get('API-address')
              .then(res => {
                  setExpensesData(res.data);
              })
              .catch(e => console.log(e))
          },[expensesData])
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2023-01-14
        • 1970-01-01
        • 2020-02-22
        • 1970-01-01
        • 2011-11-21
        • 1970-01-01
        • 2021-11-23
        • 2019-02-23
        相关资源
        最近更新 更多