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));
   }
);