javascript - 将 forEach 循环中内置的数组数据写回原始对象

标签 javascript vue.js

我在 vuejs 观察器中使用 forEach 来修改我的对象数组。目标是在每个对象最后获得新值 (end_time)。 allChapters 已经包含了我想要的所有内容,但我似乎无法将其写回原始对象。

watch: {
  episode (episode) {
    episode.chapters = episode.chapters.forEach((chapter, index, allChapters) => {
      let endTime = ''
      if (allChapters[(index + 1)]) {
        endTime = allChapters[(index + 1)].start_time
      } else {
        endTime = '99:99:99'
      }
      console.log(index + ': ' + chapter.start_time + ' / ' + endTime)
      allChapters[index] = {
        'start_time': chapter.start_time,
        'title': chapter.title,
        'end_time': endTime
      }
    })
  }
},

最佳答案

forEach 不会返回任何内容,因此您最终将 undefined 分配给 episode.chapters

删除episode.chapters =

episode (episode) {
    episode.chapters.forEach((chapter, index, allChapters) => { ... })

或使用返回新数组的map

watch: {
  episode (episode) {
    episode.chapters = episode.chapters.map((chapter, index, allChapters) => {
      let endTime = ''
      if (allChapters[(index + 1)]) {
        endTime = allChapters[(index + 1)].start_time
      } else {
        endTime = '99:99:99'
      }
      console.log(index + ': ' + chapter.start_time + ' / ' + endTime)

      return {...chapter, 'end_time': endTime};
    })
  }
},

关于javascript - 将 forEach 循环中内置的数组数据写回原始对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50275385/

相关文章:

javascript - 如何将图像放在日间事件中? clndr.js

javascript - 传递有效对象时,Object.keys() 返回 []

javascript - 进入和离开时的 VueJS 转换

javascript - Chrome 自动填充应该将表单设置为有效

javascript - 测试rootReducer中是否已经导入了所有reducer

javascript - 为购物车中的商品创建有效负载数组

javascript - 无法按下拉列表中的选定值过滤数据表

javascript - 如何从 Azure Active Directory (AAD) Web API 检索 access_token

javascript - 如何在满足特定条件时删除 Vue 2 中的 eventListener (window.removeEventListener)

javascript - Service Worker 回退接管 React SSR