如何在本机导航抽屉标题中放置适当的下拉框?

时间:2019-06-14 05:58:58

标签: javascript react-native picker setstate

我可以在react-native的导航抽屉的标题区域中放置一个下拉列表。单击下拉菜单后,文本也随之更改。但是一旦文本更改,我就会收到错误消息“ this2.setState不是函数。choosenLabel:itemValue,'_ this2.setState'未定义”。我是本机的新手,所以,我可能错过了一些简单的逻辑。

DrawerContent = (props) => {


this.state = {choosenLabel: '',};

return (
  <View>
    <View style={{ backgroundColor: 'rgb(216,21,88)', height: 160,}}>

      <View style={{flex:1, flexDirection: 'row', alignItems:'center', paddingLeft:5}}>
        <View>
          <Image
          source={{uri:'https://beta.controlplus.io/'+'uploads/users/88/1560234627YDQDhEEeYe1UHmC1WL3n.jpg'}}
          style={{width: 100, height: 100, borderRadius: 50}}
          />
        </View>
        <View style={{ width:150, paddingLeft:5}}>
          <Text style={{ color: 'white', fontSize: 15, fontWeight: 'bold', }}> Lam Kmalo </Text>
          <Text style={{ color: 'white', fontSize: 15, }}>HelloWorld1000@gmail.com</Text>
        </View>
      </View>

      <View style={styles.PickerContainer}>

        <View style={{flexDirection: 'row', alignItems: 'center'}}>

            <View style={{flex:1}}>

              <Picker
                style={styles.onePicker}
                itemStyle={styles.onePickerItem}
                selectedValue={this.state.choosenLabel}
                onValueChange={(itemValue) => this.setState({ choosenLabel: itemValue,})}
              >
                <Picker.Item label="kam Nepal" value="word1" />
                <Picker.Item label="puru email company" value="word2" />
                <Picker.Item label="chilltest" value="word3" />
                <Picker.Item label="test com apr 21" value="word4" />
              </Picker>
          </View>
        </View>
      </View>
    </View>
    <DrawerItems {...props} />
  </View>
)

}

0 个答案:

没有答案