时间戳

首页 > 解决方案 > 仅更新字符串数组时如何进行状态更新

reactjs - 仅更新字符串数组时如何进行状态更新

问题描述

伙计们，我有以下示例代码：

const [data, setData] = useState([{question: '', option: ['']}]);

然后data和setData将传递给我的组件，例如：

<Question setData={setData} data={data}/>

我在问题组件中的代码是：

const handleAddOption = (questionIndex: number) => {
    let newArray = data;

    newArray.map((item: any, i: number) => {
      if (i === questionIndex) {
        newArray[questionIndex].options.push('');
      }
    });

    setData(newArray);
  };

问题是，如果我添加一个新的整个对象，它将“刷新”我的页面并显示，但是，当我像最后几行代码一样添加时，数组中只有一个新字符串，它不会“重新渲染”。

任何人都知道如何解决这个问题？

标签： reactjsreact-hooks

解决方案

  1. 好像你有错字newArray[questionIndex].option.push('');而不是newArray[questionIndex].options.push('');
  2. 但是如果它没有帮助尝试forceUpdate();更多细节你可以在这个答案中找到如何强制组件在 React 中使用钩子重新渲染？或者尝试使用这个包 https://github.com/CharlesStover/use-force-update

祝你好运 ：）

推荐阅读