NGRX createSelector 对象在使用过滤器创建特殊选择器时获取中间线(更新至 NGRX 2021)
NGRX createSelector object get middle line, when create special selector with filter (Update to NGRX 2021)
大家好,我正在创建一个选择器来过滤商店中的一些想法,但是当我在选择器上实现它时,它会在对象上创建一条线。
选择器工作正常,但我看到它的中间线好像不是 100% 好。
我该如何解决?感谢您的帮助!
product.selector.ts
export const getAllProducts = createSelector(getProductsState, fromProduct.getAllProducts);
// createSelector with line in middle.
export const getProductsFilter = createSelector(
getAllProducts,
(products: IProduct[], filterData: string) => {
if (filterData === '')
return products;
else
return products.filter(value => value.name.includes(filterData) || value?.description.includes(filterData));
}
);
来自主页组件
const data:string='data';
this.subscription.push(this.store.pipe(select(getProductsFilter, data)).subscribe(....
所有使用 Ngrx 创建的 && ngrx 实体更新到最新版本 2021。
当我在 createSelector 上的鼠标显示该消息时
The signature '(s1: SelectorWithProps<object, string, IProduct[]>, projector: (s1: IProduct[], props: string) => IProduct[]): MemoizedSelectorWithProps<object, string, IProduct[], DefaultProjectorFn<...>>' of 'createSelector' is deprecated.ts(6387)
selector.d.ts(32, 4): The declaration was marked as deprecated here.
记得是可以的,但是感觉这行不对。
一张小图
如上评论所述selectors with props are deprecated
您只需要将 selector
重写为 factory selector
export const getProductsFilter = (props: { filterData: string }) =>
createSelector(
getAllProducts,
(products: IProduct[]) => {
if (props.filterData === '')
return products;
else
return products.filter(value => value.name.includes(props.filterData) || value?.description.includes(props.filterData));
}
);
大家好,我正在创建一个选择器来过滤商店中的一些想法,但是当我在选择器上实现它时,它会在对象上创建一条线。
选择器工作正常,但我看到它的中间线好像不是 100% 好。
我该如何解决?感谢您的帮助!
product.selector.ts
export const getAllProducts = createSelector(getProductsState, fromProduct.getAllProducts);
// createSelector with line in middle.
export const getProductsFilter = createSelector(
getAllProducts,
(products: IProduct[], filterData: string) => {
if (filterData === '')
return products;
else
return products.filter(value => value.name.includes(filterData) || value?.description.includes(filterData));
}
);
来自主页组件
const data:string='data';
this.subscription.push(this.store.pipe(select(getProductsFilter, data)).subscribe(....
所有使用 Ngrx 创建的 && ngrx 实体更新到最新版本 2021。
当我在 createSelector 上的鼠标显示该消息时
The signature '(s1: SelectorWithProps<object, string, IProduct[]>, projector: (s1: IProduct[], props: string) => IProduct[]): MemoizedSelectorWithProps<object, string, IProduct[], DefaultProjectorFn<...>>' of 'createSelector' is deprecated.ts(6387)
selector.d.ts(32, 4): The declaration was marked as deprecated here.
记得是可以的,但是感觉这行不对。
一张小图
如上评论所述selectors with props are deprecated
您只需要将 selector
重写为 factory selector
export const getProductsFilter = (props: { filterData: string }) =>
createSelector(
getAllProducts,
(products: IProduct[]) => {
if (props.filterData === '')
return products;
else
return products.filter(value => value.name.includes(props.filterData) || value?.description.includes(props.filterData));
}
);