使用 RadioButton 时在屏幕之间传递变量 React-Native

Question

我创建了一种表单，我想在按下提交时将一个变量传递到下一个屏幕。

var states = [
  {label: "happy", value: 1},
  {label: "sad", value: 2},
  {label: "angry", value: 3},
  {label: "relaxed", value: 4}
];

export default class App extends Component<Props> {
  render() {
    return (
      <View style={styles.container}>
          <Paragraph style={styles.textStyle}>How are you feeling today ?</Paragraph>
        <RadioForm
          radio_props={states}
          initial={2}
          onPress={(value) => {ToastAndroid.show(value.toString(), ToastAndroid.SHORT)}}
          buttonSize={30}
          buttonOuterSize={40}
          selectedButtonColor={'blue'}
          selectedLabelColor={'blue'}
          labelStyle={{ fontSize: 15, }}
          disabled={false}
          formHorizontal={false}
          />
       
        <Button title="Submit" onPress={() => this.props.navigation.navigate('ButtonsScreen')}/>

      </View>
    );
  }
}

所以，我想将变量“值”（用户选择的）传递给 'ButtonsScreen'。有人知道吗？

Answer 1

试试这个方法

export default class App extends Component<Props> {
  
  state = { val: "" }; // set state here

  render() {
    return (
      <View style={styles.container}>
        ....
        <RadioForm
          ....
          onPress={(value) => {
            this.setState({ val: value });
          }}
          ....
        />

        <Button
          title="Submit"
          onPress={() =>
            this.props.navigation.navigate("ButtonsScreen", {
              value: this.state.val,
            })
          }
        />
      </View>
    );
  }
}

使用 RadioButton 时在屏幕之间传递变量 React-Native

Pass a variable between the screens React-Native when using RadioButton

parameter-passing

react-native

react-native-android