如何定义 useState 嵌套数组类型

Question

如何在 UseState 数组中定义嵌套数组的类型

定义的接口 -

interface ToyProps {
  car: string | null;
  doll: number | null;
}

interface SettingsProps {
  [key: string]: ToyProps[];
}

状态 -

const [state, setstate]:SettingsProps = React.useState({
  toys: [
    {
      cars: "car 1",
      doll: "doll 1",
    },
    {
        cars: "car 2",
        doll: "doll 3",
    },
  ],
});

我按照上面的方式定义了，但仍然出现类型错误

Answer 1

您正在将该类型应用于数组，该数组包含状态对象和状态设置器函数。

\n

相反，将其作为类型参数提供给useState：

\n

const [state, setstate] = React.useState<SettingsProps>({\n// \xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92\xe2\x88\x92^^^^^^^^^^^^^^^\n    // ...\n});\n

\n

type 参数驱动 的返回类型，这将适当地设置和useState的类型。statesetstate

\n