reactjs - REACT：如何构建类似于 redux useSelector 的对象字段选择器钩子

Question

我正在尝试构建一个钩子，它将从对象返回选定的键值对子集。假设钩子可以访问如下所示的对象：

const stores = { someStore: { someField: 'fieldValue' } }

我们如何将回调传递给钩子以从stores对象中选择字段？理想的情况是让钩子像这样工作：

const {selectedField} = useStores(stores => ({ selectedField: stores.someStore.someField }))

这个钩子的目标是@inject(stores => ({...}))在我的代码库中替换 MobX。

标签： reactjstypescriptreduxreact-hooksmobx

Answer 1

只需针对stores

function useStores(selector) {
  const stores = { someStore: { someField: 'fieldValue' } };
  
  return selector(stores); 
}

const { selectedField } = useStores(stores => ({ selectedField: stores.someStore.someField }));

console.log(selectedField);