vue 使用forEach报错,this指向问题
getCrumbs(){let crumbs = JSON.parse(localStorage.getItem( "crumbs" ));//[Vue warn]: Error in created hook: "TypeError: Cannot set property 'manageClass' of undefined" 报错crumbs.forEach...
·
getCrumbs(){
let crumbs = JSON.parse(localStorage.getItem( "crumbs" ));
//[Vue warn]: Error in created hook: "TypeError: Cannot set property 'manageClass' of undefined" 报错
crumbs.forEach(function(item){
console.log(item);
if (item.name === "staffInfo") {
this.manageClass = item.manageClass
this.infoClass = item.infoClass;
}
})
},
crumbs.forEach(item => {
console.log(item);
if (item.name === "staffInfo") {
this.manageClass = item.manageClass
this.infoClass = item.infoClass;
}
})
每一个用function声明的函数在调用时都会在函数内创建自己的this。this一般是函数所操作的对象。如果没有操作的对象。this在"use strict";严格模式下是 undefined,非严格模式下是 window。
也就是说,function声明的函数总是有自己的this。从而遮盖外层作用域中的this。
如果用es6的箭头函数()=>{}就没有自己的this。在箭头函数()=>{}中访问this,是访问外层作用域中的this
getCrumbs(){
let crumbs = JSON.parse(localStorage.getItem( "crumbs" ));
//[Vue warn]: Error in created hook: "TypeError: Cannot set property 'manageClass' of undefined" 报错
// crumbs.forEach(function(item){
crumbs.forEach(item => {
console.log(item);
if (item.name === "staffInfo") {
this.manageClass = item.manageClass
this.infoClass = item.infoClass;
}
})
// 或者使用for循环
for (let i = 0; i < crumbs.length; i++) {
if (crumbs[i].name === "staffInfo") {
this.manageClass = crumbs[i].manageClass
this.infoClass = crumbs[i].infoClass;
}
}
},
更多推荐
已为社区贡献6条内容
所有评论(0)