请看我的代码:
editor.config.uploadImgHooks = {
// 上传图片之前
before:function(xhr){
console.log(this.state.goodsguid);
},
}
对于这样的代码,会不会报错,
当我们上传图片的时候,出现了这样错误:
×
Unhandled Rejection (TypeError): Cannot read properties of undefined (reading 'goodsguid')
凭借多年的代码经验可以判断在wangEditor的上传回调中:
before:function(xhr){
this.state.goodsguid
}
这个里面的this 到底是指向谁的,before,before 上父级,还是我们的组件,出现上面的报错明显是认为这个this指向的是组件,但是出现报错,说明我们的认为是错误的,此处我们不妨打印出来看一下:
这个地方的this 是before,before是一个回调的函数,本上并不我们想象的组件
如何在回调的函数中可以使用 this 并且this 指向的是组件
我们可以用箭头函数的方式来解决:
这样来写:
editor.config.uploadImgHooks = {
// 上传图片之前
before:()=>{
console.log(this);
},
}
然后我们再输出this 结果如下:
这个时候this 指向的是组件,既然指向我们的组件,那么我们就可以使用成员变量了
上面我们通过对回调函数的书写方式的变化,this 指向不同的对象,解决了报错的问题
希望对你有所帮助