具有两个 "master-slave" 选择的 Formik

Question

我有一个包含两个 select 的表格。它们中的每一个都是一个反应-select 作为用户定义的组件传递给 Field 组件。

class _TaskForm {
...
<Field name={'project'} component={Select}>
<Field name={'task'} component={Select}>
...
}

const TaskForm = withFormik({...})(_TaskForm)

现在，我想在更改项目时更改任务列表。问题是：在项目的 onChange 中，我只收到 formik 的 {options, field, form} - none 其中引用了 _TaskForm。我想访问它以便我可以更新任务的选项 select。

当项目的值发生变化时，如何访问_TaskForm？如有任何帮助，我们将不胜感激！

Answer 1

很难判断这是否正是您要查找的内容，但听起来您只是在询问如何将 Formik 道具和您自己的道具传递给 Select:

class TaskForm extends Component {
  state = { classProp: 'foo' }   
  render() {
    return (
      ...
      <Field 
        name={'project'} 
        component={formikProps => 
          <Select 
            {...formikProps}
            classProp={this.state.classProp}
          />
        } 
      />
      ...
    )
  }
}

具有两个 "master-slave" 选择的 Formik

Formik with two "master-slave" selects

reactjs

formik