如何在打字稿中创建动态数组？答案

【问题标题】：How do I create dynamic array in typescript?如何在打字稿中创建动态数组？
【发布时间】：2022-12-22 19:33:30
【问题描述】：

我想按以下格式在打字稿中创建一个动态数组

const display= [
{ id:1,displayName: "Abc1"},
{ id:2,displayName: "Abc2"},
{ id:3,displayName: "Abc3"}]

我试过以下代码

const [display,SetDisplay]=useState([])
function createData(id: number,name: string)  
{
return { id, name};
}
 SetDisplay(display.push(createData(1,"Abc1")))

但不能将数据推送到变量“显示”中。出现错误，如“类型的参数”{ id: number;结果：字符串； }' 不可分配给类型为 'never' 的参数。解决此问题的任何信息都会有所帮助。

【问题讨论】：

第二个代码用于反应组件内部——这是您正在做的事情，还是您只需要在非反应程序中使用数组的简单帮助？

标签： javascript reactjs typescript

【解决方案1】：

将类型添加到 useState：

useState<{id: number,name: string}[]>

【讨论】：

【解决方案2】：

你不应该直接改变状态。

您可以直接执行 setState 并解构以前的数组以添加新数据。

您也可以按照<{id: number; name:string}> 输入您的 setState

const [display,setDisplay] = useState<{id: number; name:string}>([]);

function createData(id: number, name: string) {
  setDisplay((prev) => [...prev, { id, name } ]);
}

【讨论】：