React Formik 比较值和初始值

Question

我已经搜索过了，不知道去哪里找。你如何比较初始值和你在 formik 中的值，当有差异时获取差异所在的值的名称。

试过这个 link 但没有成功 https://github.com/formium/formik/issues/215

如果您更新时用户名有新值，我想知道用户名已更新。

<Formik
            innerRef={formRef}
            enableReinitialize={true}
            initialValues={{
                //General
                id: currentUserData.id || '',
                username: currentUserData.username || '',
                name: currentUserData.name || '',
                surname: currentUserData.surname || '',
                dob: currentUserData.dob || '',
                position: currentUserData.position || '',
                notificationValue: currentUserData.notificationValue || 0,

                email: currentUserData.email || '',
                contactNo: currentUserData.contactNo || '',
                userRolls: currentUserData.userRolls || userRolls  ,
                status: currentUserData.status || 'Active',
                

                
            }}

Answer 1

据我所知，没有直接的方法可以实现这一目标。要实现这种比较，您需要先将初始值存储在局部变量或状态中，然后使用如下代码所示。

const initalValues = {
  //General
  id: currentUserData.id || "",
  username: currentUserData.username || "",
  name: currentUserData.name || "",
  surname: currentUserData.surname || "",
  dob: currentUserData.dob || "",
  position: currentUserData.position || "",
  notificationValue: currentUserData.notificationValue || 0,

  email: currentUserData.email || "",
  contactNo: currentUserData.contactNo || "",
  userRolls: currentUserData.userRolls || userRolls,
  status: currentUserData.status || "Active",
};


   <Formik
      initialValues={initalValues}
      enableReinitialize={true}
      onSubmit={(values) => {
        const keys = Object.keys(initalValues);

        keys.map((key) => {       
          if (initalValues[key] != values[key]) {
            console.log(key);  // Your field name which is modified       
          }
        });
      }}
    >

React Formik 比较值和初始值

React Formik compare values and initual values

compare

reactjs

formik