React native redux stateToProps 影响多个页面

This topic created in 3078 days ago, the information mentioned may be changed or developed.

Scene 1:

stateToProps islogged: state.islogged

Scene 2:

stateToProps islogged: state.islogged

用 react-native-router-flux 中的 Actions 从 1 转到 2，2 中触发 action(是个 fetch 操作)，islogged 值改变，在 componentWillReceiveProps 做个判断，这时 1 又跳出来了？？？，判断里的内容继续。有什么办法能不让 1 跳出来吗？

Supplement 1 · Dec 23, 2017

redux state 中有一个值会被两个页面用到，映射到各自的 props 中 this.props.islogged. 在 login 页面登陆成功或者在 signup 注册成功(自动登陆)可以在

componentWillReceiveProps(nextProps) {
if (!nextProps.islogged) {
....
}
}
跳转到其他页。

我的问题是无论是登陆成功还是注册成功，两个页面的 componentWillReceiveProps 都会被触发。怎么在能避免这种情况。

Supplement 2 · Dec 24, 2017

解决了。问题出在 react-native-router-flux。从 login 到 signup，react-native-router-flux 的 stack 里还保存了 login 页且并没有被 umcount，所以当 state 变化时 login 会跳出来，如果把 login 移除的话问题就没了。

8 replies • 2017-12-23 13:16:12 +08:00

lightening

Dec 23, 2017

完全没看懂你在说什么

NonClockworkChen

Dec 23, 2017

Scene 1 为什么会又跳出来,这不是 react-navigation 控制的吗,和 redux 应该没关系吧.

lbfeng

Dec 23, 2017

好像不太好形容。贴个图

https://media.giphy.com/media/xULW8pqdahzUKqBBC0/giphy.gif

login 就是 Scene 1，signup 就是 Scene 2. signup 成功后，state.islogged 就是 true，但在跳到补全资料那页时会先跳回 login 页。

lbfeng

Dec 23, 2017

@NonClockworkChen 没用 react-navigation

lbfeng

Dec 23, 2017

signup 完成后 login 里的 componentWillReceiveProps 也被触发了一次。

lbfeng

Dec 23, 2017

在 login 里把 stateToProps islogged: state.islogged 去掉的话问题就消失了。

Mikewu

Dec 23, 2017 via Android

上个变量开关判断后再执行，在页面 1 跳转到下一个页面 2 前先改变变量开关，回来时再 onfresh。
或者你在判断 this.props 与 nextProps 的 islogged 同时，增减个条件:前后 props 中 routeName 未发生变化就行了。

Dec 23, 2017 via iPhone

就是这样的啊因为你的两个页面的 props 依赖同一个 state 那就是同时变的不过你说的没明白…… 按说 login 和 register 不应该依赖 isloigin 啊每次访问这页面不应该都不管是不是登陆吗？