javascript - React Native 中的 redux-form 有问题

Question

所以我已经断断续续地研究这个问题好几天了......

问题是我无法在 React-native redux 表单中打印预填充表单的当前值。

我尝试了很多方法来简单地打印出值，但它发现它们为“未定义”，就是这样。

这是一些代码。这就是我显示表单的方式:

  render(){
const {data} = this.props
return(
  <View>
    <ScrollView style={styles.container}>
      <QuestionnaireItem title={Strings.en.fewWords}>
        <Field name={"fewWords"}
        component={TextInput}
        style={styles.fewWords}
        defaultValue={data.few_words}
        multiline={true}/>
      </QuestionnaireItem>
<!-- ... -->

这是实现表单并尝试在状态到属性映射器中打印它的方法:

let QuestionnaireFormRF = reduxForm({
  form: 'QuestionnaireForm'
 })(QuestionnaireFormComponent);

function mapStateToProps(state) {
  const selector = formValueSelector('QuestionnaireForm')
  const {
    fewWords,
    familyState,
    kidsQuantity
  } = selector(state, "fewWords", "familyState", "kidsQuantity")

  console.log(">>> " + fewWords)

  return {
    fewWords,
    familyState,
    kidsQuantity
  }
}

QuestionnaireFormRF = connect(mapStateToProps)(QuestionnaireFormRF)

export default QuestionnaireFormRF

如果有帮助的话，这就是该组件的调用方式。

    const tabArray = [
  {
    title: Strings.en.questionnaire,
    component: QuestionnaireForm,
    props: {}
  },
  {
    title: Strings.en.questionnaireForPartner,
    component: QuestionnaireForPartnerForm,
    props: {}
  }
]
export default class QuestionnaireScreen extends Component {
  constructor(props){
    super(props)
  }

  componentWillMount(){
    tabArray[0].props = { data: this.props.data, navigator: this.props.navigator }
    tabArray[1].props = { data: this.props.data, navigator: this.props.navigator}
  }

  render(){
    return(
      <TopTabsMulti tabs={tabArray} openTab={0}/>
    )
  }

}

我有点担心上述实现可能会扰乱 redux 架构，但到目前为止还没有找到确凿的证据。

因此，正如我所说，我无法以任何方式检索当前值，并且 console.log 会打印“>>> 未定义”，尽管应用程序中的值已正确填充，甚至可以从 props 中正确检索。

Answer 1

显然，您可以通过调用Navigation onChange()(表单组件中的this.props.input.onChange())函数来触发值建立。它应该在 componentwillmount() 方法中调用(至少它对我有帮助，也许有更好的函数可以调用)并且每次有实际更改时。这样就建立了表单值并可以正确选择。