Question

我在我的应用程序中使用了2个单独的StackNavigator，并在if条件结构中渲染了其中的一个。例如：

if(this.props.authToken)//authToken is a state object setting in one of my reducers
return <AppNavigator />
else
return <AuthNavigator />

看到我将几乎在AppNavigator的每个屏幕中使用该authToken对象。

我当前使用的一种方式是在每个屏幕导出语句的“ mapStateToProps”函数中获取该信息。

class SomeScreen extends React.Component {

    render() {
        return (
           <View><Text>Some UI {this.props.authToken.userName} </Text></View>
        );
    }
}

const mapStateToProps = state => {
    return {

//This line that i have to write in every screen
       authToken: state.app.authToken
    };
};

const mapDispatchToProps = dispatch => {
    return {...}
};


export default connect(mapStateToProps, mapDispatchToProps)(SomeScreen);

但是我不喜欢那样。因此，如果在大多数导航器屏幕中都存在一个对象，我希望将其从根组件传递到渲染导航器组件，例如：

 if(this.props.authToken)//authToken is a state object setting in one of my reducers
    return <AppNavigator authToken={this.props.authToken} someOtherCommonProp={{....}}/>
    else
    return <AuthNavigator />

所以我的问题是，解决该问题的最佳实践是什么。

Answer 1

我认为如果authToken不会随时间变化或通过外部方式进行更新，则您不必在redux状态下使用它，因此我认为您的解决方案看起来不错。请让我知道。

对屏幕反应本机StackNavigator默认道具

1 个答案: