我是 React-native 的新手。我有单选按钮“男性”、“女性”、“其他”的三个值,各自的值为“141”、“142”、“143”。 最初选择“男性”,但如果我们选择“女性/其他”,它仍然显示选择“男性”,但值正在保存。 下面提到了我的代码 fragment :
class advanced_targeting extends Component {
static navigationOptions = {
title: 'Advanced Targeting',
};
constructor() {
super(props)
this.state = {
isLoading: true,
radio_props: [{ label: 'Male', value: 141 }, { label: 'Female', value: 142 }, { label: 'Other', value: 143 }],
}
}
render() {
return (
<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
<View style={styles.MainContainerViewCamp}>
<Text style={{ padding: 5, fontSize: 35, backgroundColor: '#2196F3', marginBottom: 7 }}> Advanced Targeting</Text>
<ScrollView keyboardShouldPersistTaps='always'>
<RadioForm
ref="radioForm"
style={styles.radioButtonStyle}
radio_props={this.state.radio_props}
isSelected = {true}
initial={this.state.value}
formHorizontal={true}
buttonColor={'#2196f3'}
labelStyle={{ marginRight: 20 }}
animation={true}
onPress={(value,index) => {
this.setState({
value: value,
valueIndex: index
})
}} />
<TouchableOpacity
style={styles.SubmitButtonStyle}
activeOpacity={.5}
onPress={this.saveAdvancedDemography}
>
<Text style={styles.TextStyle}> SAVE DETAILS </Text>
</TouchableOpacity>
</ScrollView>
</View>
</TouchableWithoutFeedback>
);
}
saveAdvancedDemography = () => {
const base64 = require('base-64');
fetch('APIURL', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
"Authorization": "Basic " + base64.encode("demo:ABCD")
},
body: JSON.stringify(
{
"dmp_sex":
{
"main": this.state.value,
"data_type": "STRING"
},
})
})
}
主要是,This.state.value 没有更新。请帮忙
最佳答案
您的组件状态中没有value 和valueIndex。理想情况下,您应该将 genderValue 置于组件的状态中,该状态会在选择一个选项时更改其值。你的状态应该是这样的:
constructor() {
super(props)
this.state = {
genderValue: 141,
isLoading: true,
radio_props: [{ label: 'Male', value: 141 }, { label: 'Female', value: 142 }, { label: 'Other', value: 143 }],
}
}
在你的 RadioForm 中:
<RadioForm
...
initial={ this.state.genderValue }
onPress={(value) => {
this.setState({
genderValue: value,
})
}} />
然后您可以在 saveAdvancedDemography() 中使用 this.state.genderValue。
关于android - 如何在 React Native 中使用 radioForm 呈现选中/选中的单选按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49188042/