使用对自定义对象的依赖项时如何声明 usestate，例如 { filter[], sort[] }答案

【问题标题】：How to declare usestate when using dependency to custom object something like { filter[], sort[] }使用对自定义对象的依赖项时如何声明 usestate，例如 { filter[], sort[] }
【发布时间】：2022-11-10 21:35:07
【问题描述】：

我想用一个自定义对象声明 useState Hook，该对象有两个数组，如下所示

const [initConfig, setInitConfig] = useState<>({filter:[], sort:[]});

但我不知道如何在尖括号内声明。

过滤器数组将具有类型的项目

export interface IFilterTerm {
    key: string;
    criteria?: CriteriaType;
    value: string;
}

sort 将有类型的项目

type ISortGridItem = {
    colId: string | undefined;
    sort: string | null | undefined;
}

我正在使用以下设置值

setInitConfig({
      filter : [...persistentConfig.filter],
      sort : [...persistentConfig.sort]
    });

const persistentConfig = {
    filter: [ 
      { key:TIME, criteria: CriteriaType.DataRange, "value":"currentBusinessDay"},
      { key:INCLUDE_SYNTHETIC_LEGS, criteria: CriteriaType.Equals, value:"false" },
      { key:"waterfall", criteria: CriteriaType.Equals, value:"true" } 
    ],
    sort: [
      {
        colId: "time",
        sort: "asc"
      }
    ]
  }

我试图像这样声明 usestate

const [initConfig, setInitConfig] = useState<{ filter: IFilterTerm[] , sort: ISortingTerm }[]>({filter:[], sort:[]});

但没有运气。我收到错误

Argument of type '{ filter: never[]; sort: never[]; }' is not assignable to parameter of type '{ filter: IFilterTerm[]; sort: ISortingTerm; }[] | (() => { filter: IFilterTerm[]; sort: ISortingTerm; }[])'.
Types of property 'filter' are incompatible.
Type 'never[]' is not assignable to type '{ <S extends { filter: IFilterTerm[]; sort: ISortingTerm; }>(predicate: (value: { filter: IFilterTerm[]; sort: ISortingTerm; }, index: number, array: { filter: IFilterTerm[]; sort: ISortingTerm; }[]) => value is S, thisArg?: any): S[]; (predicate: (value: { ...; }, index: number, array: { ...; }[]) => unknown, thisA...'.
Type 'never[]' provides no match for the signature '<S extends { filter: IFilterTerm[]; sort: ISortingTerm; }>(predicate: (value: { filter: IFilterTerm[]; sort: ISortingTerm; }, index: number, array: { filter: IFilterTerm[]; sort: ISortingTerm; }[]) => value is S, thisArg?: any): S[]'.

【问题讨论】：

标签： javascript typescript rxjs

【解决方案1】：

您的 TypeScript 中有错字：

const [initConfig, setInitConfig] = useState<{ filter: IFilterTerm[] , sort: ISortingTerm }[]>({filter:[], sort:[]});

如果您有useState<{ filter: IFilterTerm[] , sort: ISortingTerm }[]>，则数组括号位于错误的位置。它们需要在ISortingTerm 旁边，而不是在花括号的外侧。它应该如下所示：

const [initConfig, setInitConfig] = useState<{ filter: IFilterTerm[] , sort: ISortingTerm[] }>({filter:[], sort:[]});

【讨论】：