React native material dropdown - 如何根据下拉值呈现文本答案

【问题标题】：React native material dropdown - How to render the text based on dropdown valueReact native material dropdown - 如何根据下拉值呈现文本
【发布时间】：2020-07-05 05:11:31
【问题描述】：

您好，我是新来的本地反应。我正在使用 react-native-material-dropdown。我想根据下拉值更改文本内容。默认情况下，我的文本内容为空，下拉值也为空。当 onChangeText 函数被触发时，文本内容应该根据选择的下拉值改变。

【问题讨论】：

你能在你的问题中添加一些代码吗？

标签： react-native

【解决方案1】：

请发布您的一些代码以获得更准确的答案。

同时，请查看下面的示例代码和下拉示例。请注意，下拉列表的值设置为 selectedCity value={this.state.selectedCity} 并且与 onChangeText 触发 this.setState

时操作的值相同

import React from 'react';
import { View, Text } from 'react-native';
import { Dropdown } from 'react-native-material-dropdown';

export default class DropDownEx extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            cityData: [{
                value: 'City1',
                id: '123',
                otherData: 'descr1'
              }, {
                value: 'City2',
                id: '234',
                otherData: 'descr2'
              }, {
                value: 'City3',
                id: '345',
                otherData: 'descr3'
            }],
            selectedCity: ""
        };
    }

render() {
    return (

    <Dropdown
        label='City'
        data={this.state.cityData}
        value={this.state.selectedCity}
        containerStyle={{borderColor: "gray", borderWidth: 0.5, borderRadius: 5, height: 50}}
        inputContainerStyle={{ borderBottomColor: 'transparent', paddingTop: 10, paddingLeft: 10 }}
        onChangeText={(city) => this.setState({selectedCity: city})}
     />

)}
}

【讨论】：