Question

我试图通过提供正确的类型来使打字稿愉快。但我无法弄清楚确切的语法。

export type CategoriesType = {
  id: string;
  title: string;
  url: string;
  courses: CoursesType[];
};

const [singleCategory, setSingleCategory] = useState<CategoriesType>([] as any);

useEffect(() => {
  const categories = Categories;

  for (const category of categories) {
    setSingleCategory(category);
  }
}, [singleCategory]);

return (
  singleCategory.courses !== [] ? ...
)

此代码有效。但是打字稿抱怨 any 的使用。我宁愿避免使用任何。

其他尝试：

我收到错误属性“课程”在类型“CategoriesType”上不存在 | []'

  const [singleCategory, setSingleCategory] = useState<CategoriesType | []>([]);

对象可能是“未定义”。

const [singleCategory, setSingleCategory] = useState<CategoriesType>();

Answer 1

如下设置状态。

const [singleCategory, setSingleCategory] = useState<CategoriesType[]>([])

同样在你的返回中 singleCategory.courses 没有任何意义，因为 singleCategory 是数组类型而不是对象类型。您应该根据状态定义和使用情况匹配您的类型。

React Hooks 在打字稿中使用状态初始空数组值

1 个答案: