Question

我是React-native的新手。单选按钮“男性”，“女性”，“其他”的三个值分别为“141”，“142”，“143”。最初选择“男性”但是如果我们选择“女性/其他”仍然显示“男性”为选中，但值正在保存。我的代码段如下所述：

    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"
            },
        })
    })
  }

在main中，This.state.value没有得到更新。请帮助

Answer 1

您的组件状态中没有值和 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 。

如何在反应原生中使用radioForm呈现选中/选中的单选按钮

1 个答案: