具有相同 UI 但来自 redux 的不同数据的组件

Question

有一个组件，但是来自 redux store 的数据不同，UI 是一样的，只是改变了数据的来源我使用 useSelector，所以我通过 props 传递选择器。

• 我的第一个问题是通过 props 传递选择器是好的还是不好的做法？
• 第二个问题是我输入了一个类型错误，我不知道应该如何正确输入

@types/leaflet

选择器

Argument of type 'OutputSelector<MergeStateI, GrocerieResponse[], (res: GroceriesInitStateI) => GrocerieResponse[]> | OutputSelector<...>' is not assignable to parameter of type '(state: MergeStateI) => GrocerieResponse[]'.
  Type 'OutputSelector<MergeStateI, AgencyResponse[], (res: AgenciesInitStateI) => AgencyResponse[]>' is not assignable to type '(state: MergeStateI) => GrocerieResponse[]'.
    Type 'AgencyResponse[]' is not assignable to type 'GrocerieResponse[]'.
      Property 'grocerieImages' is missing in type 'AgencyResponse' but required in type 'GrocerieResponse'.

组件

export const selectFavoriteGroceries = createSelector(
    [selectGroceries],
    (groceries: GroceriesInitStateI) => groceries.favoriteGroceries
);

export const selectFavoriteAgencies = createSelector(
    [selectAgencies],
    (agencies: AgenciesInitStateI) => agencies.favoriteAgencies
);

Answer 1

我不会通过 props 传递选择器函数，而是选择父组件中的数据，并将该数据作为 prop 传递。