React Native-Picker Item在另一个Picker中显示数据

时间:2019-10-16 07:49:46

标签: react-native picker

当我在Province中选择一个picker.item时,City将显示来自Province的数据。
帮助我解决这个问题,这是我的代码:

    constructor(props){
        super(props)

        this.state = {
                dataProvince: ['A', 'B', 'C'],
                selProvince: '',
                dataVillage: ['D', 'E', 'H'],
                selVillage: '',
}

 <Text style={Styles.overviewTitle}>Province</Text>
                    <Picker note 
                                mode="dropdown"
                                style={Styles.textInput}
                                selectedValue={this.state.selProvince}
                                onValueChange={(itemValue)=>this.setState({selProvince: itemValue})}
                        >
                            {this.state.dataProvince.map((data, key) =>
                                <Picker.Item key={key} label={data.label} value={data.value} />
                            )}
                    </Picker>

 <Picker note 
                                mode="dropdown"
                                style={Styles.textInput}
                                selectedValue={this.state.selCity}
                                onValueChange={(itemValue)=>this.setState({selCity: itemValue})}
                        >
                            {this.state.dataCity.map((data, key) =>
                                <Picker.Item key={key} label={data.label} value={data.value} />
                            )}
                        </Picker>

1 个答案:

答案 0 :(得分:0)

更改省时,您已经在更新selProvince的州值。您只需要一个json对象,就可以在您所在的州将其命名为provinceCitiesMap,其中每个省都有城市阵列作为关键字,并且选择省时,组件将由于setState而重新呈现,因此您可以获得城市阵列来自像Province ofCitiesMap [selProvince]这样的json对象,这将是城市选择器的城市数据。