#1 我有一个列的类型是对象。列可以过滤或不过滤,如果isFilterable
为true
,那么Column
类型应该要求:filterType
,isTopBarFilter?
和options
(但仅当filterType
为'SELECT'
时 - #2)。
type Column = {
name: string;
isFilterable: boolean; // passing here false should be equal with not passing the property at all (if possible)
// below properties should exist in type only if isFilterable = true
filterType: 'SELECT' | 'TEXT' | 'DATE';
options: string[]; // this property should exist in type only if filterType = 'SELECT'
isTopBarFilter?: boolean;
};
我使用类型联合来实现这种类型,它几乎可以正常工作。
type FilterableColumn = {
isFilterable: true;
filterType: 'SELECT' | 'TEXT' | 'DATE';
options: string[];
isTopBarFilter?: boolean;
};
type NonFilterableColumn = {
isFilterable: false;
};
type Column = (NonFilterableColumn | FilterableColumn) & {
name: string;
};
但是:
- 正如我之前提到的 (#2),如果
filterType
是'SELECT'
,Column
应该仅需要options
。我尝试使用类型联合来实现这一点,但结果变得奇怪:
type FilterableSelectColumn = {
filterType: 'SELECT';
options: string[];
};
type FilterableNonSelectColumn = {
filterType: 'TEXT' | 'DATE' | 'NUMBER';
};
type FilterableColumn = (FilterableSelectColumn | FilterableNonSelectColumn) & {
isFilterable: true;
isTopBarFilter?: boolean;
};
type NonFilterableColumn = {
isFilterable: false;
};
type Column = (FilterableColumn | NonFilterableColumn) & {
name: string;
};
// e.g
const col: Column = {
name: 'col2',
isFilterable: false,
filterType: 'SELECT', // unwanted
isTopBarFilter: false, // unwanted
options: ['option1'], // unwanted
};
如果我将
isFilterable
设置为false,TS不会建议不需要的属性(这很好),但是如果我传递这些不需要的props,它也不会显示错误(这很糟糕)。我的解决方案还强制传递
isFilterable
,即使它是false
,正如我上面提到的,我只想在它是true
时传递它。有没有办法改进我的解决方案(或另一个解决方案),以实现我在开头描述的内容(#1)?