React Native集成Formik后，react-native-element-dropdown无法获取选中值

问题出在Dropdown组件与Formik的事件绑定逻辑上：

• react-native-element-dropdown的onChange回调参数是选中的item对象，并非单纯文本值，你使用的onChangeText是TextInput专属属性，不适用于这个Dropdown组件。
• 当前的onChange仅处理了焦点状态，没有把选中值同步到Formik的values状态中。

修复步骤 #

1. 从Formik的props里解构出setFieldValue（这个方法比handleChange更适配自定义组件的状态更新）。
2. 修改Dropdown的onChange回调，在内部调用setFieldValue将选中的item.value同步到Formik的Experience字段，同时保留焦点状态处理。
3. 移除无用的onChangeText属性。

修复后的代码示例 #

<Formik
  validateOnMount={true}
  validationSchema={createJobValidationSchema}
  initialValues={{
    Experience: "",
    Budget: "",
    Jobdescription: "",
    Skills: "",
  }}
  onSubmit={(values) => console.log(values, "Values")}
>
  {({
    handleChange,
    handleBlur,
    handleSubmit,
    values,
    errors,
    touched,
    isValid,
    setFieldValue // 新增解构该方法
  }) => (
    <Dropdown
      style={[
        styles.dropdown,
        experienceTypeFocus && { borderColor: "blue" },
      ]}
      placeholderStyle={styles.placeholderStyle}
      selectedTextStyle={styles.selectedTextStyle}
      inputSearchStyle={styles.inputSearchStyle}
      itemTextStyle={styles.itemText}
      iconStyle={styles.iconStyle}
      data={experienceTypeData}
      labelField="label"
      valueField="value"
      placeholder="Experience"
      searchPlaceholder="Search..."
      onChange={(item) => { // 修正回调逻辑
        setFieldValue("Experience", item.value); // 将选中值同步到Formik
        setExperienceTypeFocus(false);
      }}
      value={values.Experience}
    />
  )}
</Formik>

补充说明 #

如果偏好使用handleChange，也可以这样写，但setFieldValue的逻辑更直观：

onChange={(item) => {
  handleChange("Experience")(item.value);
  setExperienceTypeFocus(false);
}}

核心是要确保Dropdown的选中值被正确传递给Formik的状态更新方法，避免误用TextInput的事件属性。

内容的提问来源于stack exchange，提问作者user19614803