Question

我目前面临一个问题，我要从API中获取数据，然后我想操纵数据以创建一个称为事件的数组，该数组可以用来传递给我的日历。我正在尝试以下方法：

const createEvents = () => {
        workouts.map((w)=> {
            setEvents(...events, 
            {           
                id: w.id,
                title: w.name,
                date: w.dateOfWorkout
            });

        });

但是我得到了错误，它指出只期望1个参数，却得到了2个。在进行谷歌搜索时，我遇到了该网站（https://daveceddia.com/usestate-hook-examples/），该网站的示例与上述示例非常相似。我将事件定义如下：

const [events, setEvents] = useState([]);

我在这里想念什么？我对TS和JS相当陌生。我来自C＃，从本质上讲，我正在尝试做以下事情：

myData.Select(x => new {
Id = x.Id,
...
})

Answer 1

您可以尝试将参数放入数组吗？

setEvents([
//--------^
  ...events, 
  {           
    id: w.id,
    title: w.name,
    date: w.dateOfWorkout
  }
]);

顺便说一句，即使它正在工作，我也不会在地图内（或任何其他循环内）调用setEvents，这种方式不应该使用它。

我可能会做类似的事情：

const createEvents = () => {
  setEvents([...events,
    workouts.map((w) => ({
      id: w.id,
      title: w.name,
      date: w.dateOfWorkout
    }))
  ]);
};

Answer 2

尝试一下：

const newEvents = 
        workouts.map((w)=> ({
                ...events,
                id: w.id,
                title: w.name,
                date: w.dateOfWorkout
            })
        )

然后，您可以致电：

setEvents(newEvents)

在您的示例中，地图没有返回任何内容。 Map是一个高阶函数，它只接收一个函数作为参数并返回转换后的对象数组。

Typescript反应，如何设置数组状态

2 个答案: