为了账号安全,请及时绑定邮箱和手机立即绑定

请问react redux 怎么访问其他model的state?

/ 猿问

请问react redux 怎么访问其他model的state?

跃然一笑 2019-08-17 15:11:09

react redux 怎么访问其他model的state


查看完整描述

4 回答

?
沧海一幻觉

* login({ payload },{select,call, put}){
//这里state是所有model的state,如获取model app下的state的isLogin就写,state.app.isLogin
const isLogin = yield select(state => state.isLogin);
console.log('logincheck',isLogin);
if(isLogin === false){
yield put((routerRedux.push('/login')));
}

},





查看完整回答
反对 回复 2019-08-18
?
墨色风雨

1、先说redux的作用
代理top-level single data flow,从最外层的container下发数据流触发dumb components的更新。
2、题主的业务场景是否可以由redux解决
答案肯定是可以的,但不一定合理。
下发props告知组件B执行更新,用过react的同学都很熟悉这一套,这边不赘述。
3、业务场景的特殊性
组件交互存在两种情形,一种是纯数据模型层面的组件映射关系,完全可以由redux处理;另一种是eventEmitter层面的交互,比如使用ng2的eventEmitter或者vue的$dispatch场景。
对于后者redux其实是提供解决方案的,一种是写个小型中间件,专门用于处理pub/sub,另一种是利用redux的subscribe接口添加观察者函数来触发pub/sub。
4、是否真的需要eventEmitter
不需要。
既然你用的是react + redux,就应该遵循它的设计原则,对组件划分的时候,建立足够好的view model一一映射关系。没有什么是redux解决不了的,如果有,那就重新思考下组件设计是否合理,如果还不行,那就考虑写个中间件。



查看完整回答
反对 回复 2019-08-18
?
胡子哥哥

关于react和redux技术流的搭建,欢迎看我写的mini-react-redux项目。
用仅仅50行代码,搭建react、redux的完整项目,具备所有功能。项目地址:GitHub - slashhuang/mini-react-redux: 极小型的react+redux的项目搭建,共50行代码
---------------------------------------------------------------------------------分割线----------------
确实之前没有看清题主的问题,特来重答一下。
没错,对于小页面,比如移动端页面完全可以去除redux,而仅仅采用react的state来进行管理。 对于大型交互式的界面,比如美团内部的即时通讯工具大象,这种大数据量和逻辑复杂的页面可以采用redux进行管理,以便更好的维护和扩展功能。
关于react如何由redux代理state这一点,其实是调用的redux的subscribe接口,redux由此提供了整个react的state入口。
针对题主的问题,要很好的利用redux,其实恰恰需要将react的state和props利用起来。 在代码编写中,一个简单的原则就是组件内部可以完成的事情由state负责,组件依赖的外部数据由redux代理的state传给props。 这一点体现的就是container是调度组合组件的入口,而components是仅仅接受数据的笨拙组件。
最后,redux并不一定需要添加进react系列项目,看业务场景有所取舍即可





查看完整回答
反对 回复 2019-08-18
?
素胚勾勒不出你

可能是你的action没有connect到组件上,没有把这个方法传过来。 1.参考我写的一个方案

1

2

3

4

@connect(

    state => state,

    dispatch => bindActionCreators(action, dispatch)

)


2.根据redux文档的方案

1

2

3

4

5

6

7

8

9

10

// 哪些 action 创建函数是我们想要通过 props 获取的看

function mapDispatchToProps(dispatch) {

  return {

    onIncrement: () => dispatch(increment())

  };

}

 

export default connect(

  mapDispatchToProps

)(Counter);


查看完整回答
反对 回复 2019-08-18

添加回答

回复

举报

0/150
提交
取消
意见反馈 邀请有奖 帮助中心 APP下载
官方微信