我正在使用最新的TypeScript构建一个自定义React钩子。我在理解如何正确使用satisfies
运算符方面遇到问题。我想使用它的原因是因为我无法传递条件值。
我的爱好:
import { useQuery } from 'react-query';
import { axiosClient } from '@src/features/@Api';
import type {
FeathersFind,
FeathersQuery,
} from '@features/@Api/@types/feathers';
import type { Model } from '@features/@Api/@types/models';
type Result = FeathersFind & {
data: Model[];
};
type Query = FeathersQuery & Model;
export const useFetchModels = (query?: Query) => {
const defaultQuery = {
$limit: 1000,
$sort: {
createdAt: -1,
},
...(query || {}),
};
const { isFetching, isLoading, refetch, data, ...rest } = useQuery(
'query-models',
async () => {
const { data }: { data: Result } = await axiosClient.get('/models', {
params: defaultQuery,
});
return data;
},
{
cacheTime: 1000 * 60 * 60,
}
);
return { isFetching, isLoading, refetch, data, ...rest };
};
如何使用
const [selectedMakeId, setSelectedMakeId] = React.useState('imagine-valid-id-here');
const { data: models } = useFetchModels({
makeId: selectedMakeId,
});
错误:
Argument of type '{ makeId: string; }' is not assignable to parameter of type 'Query | undefined'.
Type '{ makeId: string; }' is missing the following properties from type 'Model': _id, name, make, createdAt, updatedAt
类型:(已尝试FeathersQuery|模型;以及特征查询和模型;)
type Query = FeathersQuery | Model;
export type FeathersQuery = {
$limit?: number;
$skip?: number;
$sort?: {
[key: string]: 1 | -1;
};
};
export type Model = {
_id: string;
name: string;
make: Make;
makeId: string;
createdAt: Date;
updatedAt: Date;
};
最终目标:我想有条件地传递来自两个对象的任何值。我猜我需要使用new运算符来满足它?
1条答案
按热度按时间62lalag41#
代码缺少一些类型,所以很难100%确定其意图。
假设意图是将
Model
的任何字段作为useFetchModels
钩子中的过滤器传递给我们,那么您实际上要查找的是Partial
。这将允许您指定Model
上存在的任何属性,但不要求您指定Model
的所有必需属性(它使传入类型的所有属性都是可选的)Playground链接