我如何将形式的数据存储为reactj中localstorage的数组

Question

我拥有的一些状态

  const initialValues = {companyname:"", email:"", phone:"",website:""}
  const [formValues, setFormValues] = useState(initialValues);
  const [formErrors, setFormErrors] = useState({});
  const [isSubmit, setIsSubmit] = useState(false);

试图将形式的数据（FormValues）存储在LocalStorage中，从提交中以将其存储在数组中，但不能在数组中进行

 
  useEffect(()=>{
    localStorage.setItem('formValues',JSON.stringify(formValues) );
  },[formValues]);
``
[![**enter image description here**][1]][1]


  [1]: https://i.sstatic.net/7yprY.png

Answer 1

这是您代码的小例子

export default function App() {
  const [initialValues, setInitialValues] = useState({
    companyname: "",
    email: "",
    phone: "",
    website: ""
  });
  const [formValues, setFormValues] = useState([]);

  const submitForm = () => {
    setFormValues((prevFormValues) => [...prevFormValues, initialValues]);
  };

  useEffect(() => {
    localStorage.setItem("formValues", JSON.stringify(formValues));
  }, [formValues]);
  return (
    <div className="App">
      <div>
        companyname
        <input
          value={initialValues.companyname}
          onChange={(e) =>
            setInitialValues({ ...initialValues, companyname: e.target.value })
          }
        />
      </div>
      <div>
        website
        <input
          value={initialValues.website}
          onChange={(e) =>
            setInitialValues({ ...initialValues, website: e.target.value })
          }
        />
      </div>
      <button onClick={submitForm}>onSubmit </button>
    </div>
  );
}