useStore 简单封装

108 阅读1分钟

最近看到方法,感觉很奇怪,思考一下为什么,谢了这篇文章

方法

const address = useStore((res) => res.address);

这个方法作用是封装了对store的取值操作

方法实际封装

import { useSelector } from "react-redux";
import { IReduxStore } from "../redux";


export const useStore = <T>(value: (store: IReduxStore) => T) => {
    return useSelector(value);
}

可能ts了解的不够深,没太看懂

我又自己弄了个差不多的实验一下

// 自定义 Hook
function useStore(selector) {
  const obj = {
    address: 'address',
    address2: 'address2',
  }
  return selector(obj)
}

// 使用
const address = useStore((state) => {
  console.log(`  state.address ==>`, state.address)
  return state.address
})
console.log(`state ==>`, state)

发现可以这样封装,可能之前没弄过这种,感觉很奇怪好像这样确实好用点,

自已在定义一些类型,就可以直接取store中的值了