アクセスReduxの状態私は<a href="https://reactnavigation.org/" rel="nofollow noreferrer">React-Navigation</a>を使用して、以下のナビゲーターを持つナビゲーション

Question

を反応させるの使用：

const Navigator = StackNavigator(
    { 
    Home: { 
     screen: Home 
    }, 
    User: { 
     screen: User 
    } 
    } 
) 

そして、私のUserコンポーネント：

export default class User extends Component { 
    static navigationOptions = { 
    title:() => 'User' 
    } 

    render() { 
    return (
     <Text>This is the user page.</Text> 
    ) 
    } 
} 

私はUserシーンのナビゲーションバーのタイトルは、ユーザーのなりたいです名。名前はRedux状態に保持されます。その後、

this.props.navigation.navigate('User', {name: user.name}) 

をしかし、ユーザーの名前がUserにときに更新されている場合、私はHomeシーンからUserシーンにアクセスしていますので、私はシーンを押すと、私は、ユーザーの名前を渡すことができ

ナビゲーションタイトルは更新されません。私が見ることができる唯一の解決策はnavigationOptionsからRedux状態にアクセスすることです。これを行う方法やこの問題を処理するためのより良い方法はありますか？ありがとう。

Answer 1

私が反応し、ナビゲーションをGitHubのレポにissueから私の答えに2つの解決策を見つけました。

1）this.props.navigation.state毎回更新小道具変更：

static navigationOptions = { 
    title: (navigation) => <MyConnectedTitle navigation={navigation} /> 
} 

：

componentWillReceiveProps(nextProps) { 
    if (nextProps.totalCharge) { 
    this.props.navigation.setParams({ totalCharge }); 
    } 
} 

2）Reduxの状態に接続されているNavigationTitleコンポーネントを作成します

Answer 2

私はあなたがコンポーネントから

this.props.navigation.navigate('User', {name: user.name})

を呼び出していると仮定しています。したがって、ユーザーの名前を持つコンポーネントのmapStateToPropsを入力し、{name: ...という変数に渡す必要があります。例えば

：

export class Component { 
    render() { 
    return (
     <View> 
     <Button onPress={() => this.props.navigation.navigate('User', {name: this.props.userName})} 
     </View> 
    ) 
    } 
} 

const mapStateToProps = (state) => ({ 
    userName: state.user.name 
}) 

export default connect(mapStateToProps)(Component)