Heim  >  Fragen und Antworten  >  Hauptteil

So aktualisieren Sie mehrere Zustände im Localstorage-Objekt React

Ich habe also bereits einen localStorage-Hook, der den Status beibehält, aber jetzt möchte ich zwei Elemente im Objekt aktualisieren

Dies ist die Funktion zum Hinzufügen von Updates

const { data, setData } = useLocalStorage();

  const addWorkExperience = () => {
    let additionJob = {
      ...data,
      jobExperience: [
        ...data.jobExperience,
        {
          city: "",
          company: "",
          country: "",
          current: false,
          endMonth: "",
          endYear: "",
          jobTitle: "",
          startMonth: "",
          startYear: "",
          state: "",
          workDesc: "",
        },
      ],
      currentEditedJob: data.currentEditedJob + 1,
    };

    setData(additionJob, console.log(additionJob, data));

Wenn es protokolliert wird, wird ein jobExperience-Array wie dieses angezeigt: jobExperience: (6) ['0', '1', '2', '3', '4', '5', {…} ]Nur ein Objekt wird gespeichert, der Rest wird in Zahlen umgewandelt

Das ist mir aufgefallen, wenn ich currentEditedJob: data.currentEditedJob + 1, ,一切都会正常工作,并且状态更新良好,并且它们会保存为对象 jobExperience: (6 ) [{…}, {…}, {…}, {…}, {…}, {…}, {…}]

aus dem angehängten Jobobjekt entferne

Gibt es eine Lösung

Ich habe versucht, den Status einzeln zu aktualisieren, aber es hat nicht gut funktioniert.

setTemplateData((prev) => ({...prev,
        jobExperience: [
           ...prev.jobExperience,
           {
             city: "",
             company: "",
             country: "",
             current: false,
             endMonth: "",
             endYear: "",
             jobTitle: "",
             startMonth: "",
             startYear: "",
             state: "",
             workDesc: "",
          },
        ],
       currentEditedJob: data.currentEditedJob + 1,
     }), console.log(additionJob, data));

Aber wenn ich es nicht entferne currentEditedJob: data.currentEditedJob + 1,, ist es immer noch derselbe Fehler

P粉696605833P粉696605833421 Tage vor530

Antworte allen(1)Ich werde antworten

  • P粉872182023

    P粉8721820232023-09-15 09:04:47

    问题似乎出在 addWorkExperience 函数中的 currentEditedJob 属性上。根据您提供的代码,data.currentEditedJob 似乎是数字的字符串表示形式,当您向其添加 1 时,它会连接数字而不是执行算术加法。

    要解决此问题,您可以将 data.currentEditedJob 转换为数字,然后再加 1。以下是 addWorkExperience 函数的更新版本:

    const currentEditedJob = parseInt(data.currentEditedJob, 10); // Convert to number
      const additionJob = {
        ...data,
        jobExperience: [
          ...data.jobExperience,
          {
            city: "",
            company: "",
            country: "",
            current: false,
            endMonth: "",
            endYear: "",
            jobTitle: "",
            startMonth: "",
            startYear: "",
            state: "",
            workDesc: "",
          },
        ],
        currentEditedJob: currentEditedJob + 1, // Perform arithmetic addition
      };
    
      setData(additionJob);
      console.log(additionJob, data);
    };

    通过使用 parseInt() 将 data.currentEditedJob 转换为数字,加法操作将正常工作,并且状态将按预期更新。

    Antwort
    0
  • StornierenAntwort