ReactJs - 類型錯誤：無法分配給 object 的只讀屬性“名稱”'#<object> '<div id="text_translate"><p> 我有一個對象數組：</p><pre> var subcategories = [{name:'gloves', tag:'wool'}, {name:'boots', tag: 'leather'}]</pre><p> 我只想找到 object 的索引來更改名稱或標簽。 我用這個 function：</p><pre> function setSubcat(val, index, lang){ var newArr = [] var obj = { 'name': val } subcategories.map((val, i)=>{ if(index === i){ var newObj = Object.assign(val, obj) newArr.push(newObj) } newArr.push(val) }) setSubcategories(newArr) }</pre><p> 錯誤發生在var newObj = Object.assign(val, obj)</p><p> 我認為這個錯誤意味着我不能直接改變 state，所以我必須復制一份。 我認為通過subcategories映射並將其推送到本地newArr意味着我制作了數組的副本。 但是當我想在其中更改 object 的值時它不起作用，所以我使用了 Object.assign，我認為它會從數組中深度復制特定的 object，但它也不起作用。</p><p> 我在這里錯過了什么？</p></div></object>

Question

我有一個對象數組：

var subcategories = [{name:'gloves', tag:'wool'}, {name:'boots', tag: 'leather'}]

我只想找到 object 的索引來更改名稱或標簽。 我用這個 function：

function setSubcat(val, index, lang){
   var newArr = []
   var obj = {
      'name': val
   }
   subcategories.map((val, i)=>{
      if(index === i){
         var newObj = Object.assign(val, obj)
         newArr.push(newObj)
      }
      newArr.push(val)
   })
   setSubcategories(newArr)
}
           

錯誤發生在var newObj = Object.assign(val, obj)

我認為這個錯誤意味着我不能直接改變 state，所以我必須復制一份。 我認為通過subcategories映射並將其推送到本地newArr意味着我制作了數組的副本。 但是當我想在其中更改 object 的值時它不起作用，所以我使用了 Object.assign，我認為它會從數組中深度復制特定的 object，但它也不起作用。

我在這里錯過了什么？

Answer 1

正如評論中指出的那樣：

• 您發布的代碼未顯示您如何創建具有不可修改屬性的 object
• 您可以創建一個新的 object 而不是使用 Object.assign 來消除錯誤
• 以更慣用的方式使用map function

interface TaggedItem {
    name: string,
    tag: string
}
var subcategories = [{name:'gloves', tag:'wool'}, {name:'boots', tag: 'leather'}];

function setSubcat(val: string, index: number, _lang: any){
   var obj: Partial<TaggedItem> = {
      'name': val
   }
   var newArr: TaggedItem[] = subcategories.map((val, i)=>{
      if(index === i){
        return {
            ...val,
            ...obj
        } 
      } else {
        return {...val};
        // or return val; if you don't need a full copy
      }
   })
   console.log(newArr);
}

setSubcat('newName', 0, undefined);

游樂場鏈接