极客观点
项目管理
HarmonyOS
问题描述
小弟在vue中定义了一个对象数组，想要将后台传来的json数组对象赋值到里面，结果赋值失败
问题出现的环境背景及自己尝试过哪些方法
相关代码
// 请把代码文本粘贴到下方（请勿用图片代替代码）
let vm = new Vue({
el:'#boardData',
data:{
boardList:[
{boardId:1,boardName:'纽约',bookboardTime:"2019.01.01 18:01:22"},
{boardId:2,boardName:'伦敦',bookboardTime:"2019.01.01 18:01:22"},
{boardId:3,boardName:'日本',bookboardTime:''},
{boardId:4,boardName:'东北',bookboardTime:''}
]
},
methods:{
getBoardList(){
this.$http.get("http://localhost:8094/api/boardList").then(res=>{
res.data.forEach(function(key,index){
this.boardList[index] = key
})
//this.boardList[0] = res.data[0]
console.log(this.boardList)
})
},报错：
Uncaught (in promise) TypeError: Cannot set property '0' of undefined
at http://localhost:8094/sellerUI/detail/boardList.html:111:34
at Array.forEach (native)
at Vue.$http.get.then.res (http://localhost:8094/sellerUI/detail/boardList.html:109:21)(anonymous) @ boardList.html:111
$http.get.then.res @ boardList.html:109
使用下面的代码就不会报错
let vm = new Vue({
el:'#boardData',
data:{
boardList:[
{boardId:1,boardName:'纽约',bookboardTime:"2019.01.01 18:01:22"},
{boardId:2,boardName:'伦敦',bookboardTime:"2019.01.01 18:01:22"},
{boardId:3,boardName:'日本',bookboardTime:''},
{boardId:4,boardName:'东北',bookboardTime:''}
]
},
methods:{
getBoardList(){
this.$http.get("http://localhost:8094/api/boardList").then(res=>{
/*
res.data.forEach(function(key,index){
this.boardList[index] = key
})*/
this.boardList[0] = res.data[0]
console.log(this.boardList)
})
},
你期待的结果是什么？实际看到的错误信息又是什么？
希望大佬们给讲解讲解是怎么回事
数组的forEach方法的参数是个回调函数，这个回调函数的 this 指向的是当前遍历到的那个子项，所以你可以用 for of 语句来代替 forEach 方法，或者将 this.boardList 赋给其他常量再放到到 forEach 的回调函数体中。