使用 React Hooks 从 API 获取请求更新数据？答案

【问题标题】：Update data from API fetch request with React Hooks?使用 React Hooks 从 API 获取请求更新数据？
【发布时间】：2021-06-16 17:40:15
【问题描述】：

我正在努力寻找一种方法来更新和操作获取的数据。每次单击 Plus 按钮时，我希望 {data.servings} 增加 1。尽管呈现的数据是 a number of servings 但它的数据类型是 STRING 所以我想出了一种方法将其值分配给一个名为 portions 的变量> 并将其转换为 number，如下所示。但是，我无法更新或操作它。任何帮助将不胜感激。提前致谢！！

const handleData = () => {

  const [data, setData] = useState();

    useEffect(()=>{
      fetch(url)
        .then(res => res.json())
        .then(data => setData())
    },[url])


    const handleIncrement = (e) =>{
      let portions = parseInt(e.currentTarget.previousSibling.innterText)
    }
    return (
      <>
        <Minus />
        //the output of {data.servings} is 2 but it's data type is STRING
        <p>{data.servings}</p>
        <Plus onClick={handleIncrement}/>
      </>
    )
}

【问题讨论】：

标签： javascript reactjs react-hooks

【解决方案1】：

你可以试试这个handleIncrement函数

const handleIncrement = () => {
  let copyData = { ...data };
  copyData.servings = `${parseInt(copyData.servings) + 1}`;
  setData(copyData);
};

【讨论】：