ReactJS，Hooks - 如何在 .map() 函数之后设置状态？

Question

我正在尝试使用数组中的值更改状态。例子：

const [state, setState] = useState({});

const test = [1, 2, 3];

        test.map((item, i) => {

          setState({ ...state, [`item-${i}`]: item });

        });

目前的状态是：

item-2: 3

我想要实现的是：

item-0: 1,

item-1: 2,

item-2: 3

我尝试了几种方法（看起来都相似），但效果是一样的：/有谁知道如何解决它？

Answer 1

您可以使用forEach()以下方法更新状态：test.forEach((item, i) => {   setState(state => ({...state, [`item-${i}`]: item}));});

Answer 2

您可以使用 set state 的功能版本和 reduce 来完成此操作：  setState(prevState => {    return test.reduce((acc, next, i) => {      return {        ...acc,        [`item-${i}`]: next      },    }, prevState);  });这样做的好处是可以在一次调用中完成，并且更容易阅读。