简体   繁体   English

如何在 Formik 中通过自定义组件在 React Native 中设置值

[英]How to Set Value in Formik from custom component in react native

i have made custom component from react native picker and want to update value in formik when i change it but it say undefined variable setFieldValue when i pass it in my custom component prop as callback function how can i set formik value from my custom component below is my custom compoment which i have imported in formik page我已经从本机选择器中创建了自定义组件,并希望在我更改它时更新 formik 中的值,但是当我将它作为回调 function 在我的自定义组件道具中传递时,它说未定义变量 setFieldValue 我如何从下面的自定义组件中设置 formik 值是我在 formik 页面中导入的自定义组件

<Formik
        initialValues={{
          calltype: '',
          callfrom: '',
          callto: '',
          calldate: '',
          joinedby: [],
          tripinfo: {},
          additionalinfo: '',
          autoaccept: null,
        }}
        // validationSchema={CallValidationSchema}
        onSubmit={(values, {setSubmitting, resetForm}) => {
          setSubmitting(false);
          sendValues(values);
        }}>
        {({
          submitForm,
          handleBlur,
          touched,
          errors,
          values,
          handleChange,
        }) => (
          <View>
            <ARow
              row
              justifyContent="space-between"
              alignItems={'flex-end'}>
              <ACol col={6}>
                <Picker
                  callbeck={getdata}
                  fieldname="calltype"
                  data={pickerdata}
                  inputBgColor="#F5F5F5"
                  heading="Call Type"
                  placeholder={'Select Call Type'}
                  onerror={false}
                  color={'#A9A9A9'}
                  value={values.calltype}
                />
                {errors.calltype && touched.calltype ? (
                  <AText color={'red'} pb={'5px'}>
                    {errors.calltype}
                  </AText>
                ) : null}
              </ACol>
              <ACol col={6}>
                <AText xtrasmall right>
                  #1100669
                </AText>
              </ACol>
            </ARow>
         </View>
        )}
      </Formik>

const CustomPicker = ({
<Picker
      style={{
        color: color ?? '#0D4D8D',
        margin: -16,
        height: 68,
        marginRight: -12,
        marginLeft: -4,
      }}
      selectedValue={selected}
      onValueChange={(itemValue, itemIndex) => {
        callbeck(fieldname, itemValue);
        setSelected(itemValue);
      }}>
      <Picker.Item style={{fontSize: 12}} value="" label={placeholder} />
      {!isEmpty(data) &&
        data.map(item => (
          <Picker.Item
            style={{fontSize: 12}}
            label={item.name}
            value={item.id}
          />
        ))}
    </Picker>
);
};

Ok Issue is Solved i have not destructured formik properly thats why its saying undefined variable setFieldValue,now when i send setFieldValue function in prop it works..好的,问题解决了,我没有正确地解构 formik,这就是为什么它说未定义的变量 setFieldValue,现在当我在 prop 中发送 setFieldValue function 时,它起作用了。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM