目前state组件只用到了state.user,如果我们可以提供一个选择函数
比如connect的第一个参数,用括号来表达,state返回一个对象
const User = connect(state => {return { user:state.user }
对象里面的user拿到state.user
这样做法是有意义的
如果我们拿到的数据点很长比如state.xxx.yyy.zzz.user。name
可以快速获取到局部的state
目前只是api的实现
const User = connect(state => {
return { user:state.user }
})(({user}) => {
return <div> User: {user.name}</div>
接着代码的编写
redux.js
connect 函数添加一个参数 selector表示先接受一个参数,再接受第二个参数const connect = (selector) => (Component) => {
export const connect = (selector) => (Component) => {
return (props) => {
const { state,setState } = useContext(appContext)
const [, update] = useState({})
const data = selector ? selector(state) : {state: state}
useEffect(() => {...}, [])
const dispatch = (action) => {...}
return <Component {...props} {...data} dispatch={dispatch} >
如何使用
声明data 传入state ,data就是用户需要的所有属性const data = selector(state)
把所有数据放到component上面,props后面 state={state}删除return <Component {...props} {...data} dispatch={dispatch} >
有些错误需要处理
1.如果用户没有传selector?
没传data是全局state,传了是局部state
加一个条件判断const data = selector ? selector(state) : state
这样其他connect都需要调用2个参数,一个是selector,第二个component
其他地方用到connect的也需要修改
修bug Cannot read property ‘user’ of undefined

可能是UserModifier 中的state传的不对
看下源码
修改为data = {state: state} ,意思是传了selector 给一个state,不传给一个userconst data = selector ? selector(state) : {state: state}
