在 NavigationOptions 中访问组件状态 - React Native

本文介绍了在 NavigationOptions 中访问组件状态 - React Native的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我试图通过状态值有条件地呈现 HeaderLeft，我无法访问 NavigationOptions 中的状态值

I was trying to conditionally render HeaderLeft by state value, I cant able to access state value inside NavigationOptions

 static navigationOptions = ({ navigation }) => ({



    headerLeft: (navigation.state.searchText)? <View style={{ flexDirection: 'row', justifyContent: 'center' }}>

        <TouchableOpacity onPress={() => {
           // navigation.navigate('home');
           alert('Coming soon ');
        }}>
            <Image style={{ marginLeft: 20,height:20,width:20,resizeMode:"contain" }} source={require('../assets/header_icons/three_logo.png')} />
        </TouchableOpacity>
    </View> : <View style={{ flexDirection: 'row', justifyContent: 'center' }}>

<TouchableOpacity onPress={() => {
   // navigation.navigate('home');
   alert('Coming soon');
}}>
    <Image style={{ marginLeft: 20,height:20,width:20,resizeMode:"contain" }} source={require('../assets/header_icons/icon_arrow_left.png')} />
</TouchableOpacity>
</View>

});

我的组件确实挂载了

  componentDidMount(){
  this.setState({threebool:true});
  this.props.navigation.setParams({

    searchText: this.state.threebool,
  });
}

我的构造函数

constructor(props) {
  super(props)
  this.state = {
    threebool:true,

  }
}

请告诉我如何解决这个问题.

Please let me know how to resolve this.

推荐答案

this.props.navigation.setParams({
  handleSubmit: this.handleSubmit,
  state: this.state;
});
handleSubmit = () => {}

在导航选项中，您将获得值

in navigation option you will get values by

static navigationOptions = ({ navigation = this.props.navigation }) => {
const state = navigation.state.params.state;
const handleSubmit = navigation.state.params.handleSubmit;}

这篇关于在 NavigationOptions 中访问组件状态 - React Native的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！