this关键字是指当前组件的实例,使用this可以直接访问当前组件中的属性和方法。
比如,在组件的methods中,通过this可以访问组件的data对象,如下所示:
export default {data() {return {message: 'Hello World'}},methods: {showMessage() {console.log(this.message);}}
}
that是一个临时对象,用于在函数内部保存this的值。
在一些情况下,函数内部的this并不是指向当前组件的实例,此时可以使用that来保存this的值,以便在函数内部继续使用。
比如,在使用uni.request向服务器发起请求时,由于this的指向已经改变,此时需要使用that来保存当前组件的实例,示例如下:
export default {data() {return {items: []}},methods: {loadData() {//第一种解决方案,that 保存当前组件的实例 let that = this;uni.request({url: '*******',
//该success方法指向闭包,所以this属于闭包,由此在success回调函数里是不能直接使用this.items的success(res) {//在此处使用that来访问items属性,而不是thisthat.items = res.data;}})},loadData() {//第二种解决方案,使用箭头函数 uni.request({url: '*******',
//箭头函数会默认帮我们绑定外层 this 的值,所以在箭头函数中 this 的值和外层的 this 是一样的success:(res)=>{this.items = res.data;}})}}
}