将 formik 和 select 数组反应为字符串 Convert onSubmit

Question

我正在使用 React formik 和 React select 包。我创建的表单包含用户可以创建新的和编辑也以相同的形式工作。我有一个多 select 字段，字段值在数组中我想更改为字符串发送到 onSubmit 上的服务器。而且在更新时我想将字符串值转换数组设置为 select 字段。我尝试了但找不到解决方案。请给我任何想法这对我有帮助代码沙盒：https://codesandbox.io/s/multipleselect-formik-3eqxp?file=/src/RegisterForm.js 感谢帮助

Answer 1

我不确定这是否是您要找的，但我做到了

     function create(fields) {
    fields.job = JSON.stringify(fields.job)
    console.log(fields);
  }

或

  function create(fields) {
    const jobs = [];
    fields.job= fields.job.map((ele) => jobs.push(ele.value));
    console.log(fields);
  }

而不是

  function create(fields) {
    console.log(fields);
    const jobs = [];
    fields.job.map((ele) => jobs.push(ele.value));
    const job = ("text => ", jobs.toString());
    console.log(job);
    console.log(fields);
  }

Answer 2

我想你想从数组中获取结果应该是的值

{name: "111", fatherName: "222", job: ["enginner", "painter"] }

function create(fields) { 
    const amendedFields = {
      ...fields,
      job: fields.job.map((ele) => ele.value) // extract value from object,  ["enginner", "painter"]
    }; // not mutating the current fields object, copy it and mutate the new one.
    console.log("old", fields);
    console.log("new", amendedFields);
}

Answer 3

获取字段值后，在提交前将数组更改为字符串。我们想在字段上绑定更改字符串值。它对我来说很好用。

代码沙箱 link :https://codesandbox.io/s/multipleselect-formik-3eqxp?file=/src/RegisterForm.js:657-844

 function create(fields) {
    console.log(fields);
    const jobs = [];
    fields.job.map((ele) => jobs.push(ele.value));
    fields.job = jobs.toString();
    console.log(fields);
  }

将 formik 和 select 数组反应为字符串 Convert onSubmit

React formik and select array to string Convert onSubmit

javascript

arrays

reactjs

react-select

formik