微信小程序有没有避免频繁使用"const that = this"的技巧？-灵析社区
刘一抗二二微信小程序`const that = this`的疑问 我看微信小程序异步方法回调的时候，有很多`const that = this` 查了资料，说是因为原方法page调用，回调方法框架调用，this变了，所以用that来保留page 那么有没有什么办法避免掉回调里频繁出现的`const that = this`？ 希望能有个方便的、框架式的解决办法 —————— 已经解决了，箭头函数神无敌！ 我以前都不喜欢这类后来的写法，都很传统的用`success: function() {...}` 今天这个问题刷新了我的认知，我以后就用`success: () => {...}`了
木子弓长就是使用
"🔗箭头函数" (https://link.segmentfault.com/?enc=YWjdZXkBmC6hTzizPMGbdw%3D%3D.9wRf8kyo3fITLNQSD5fY5DmimVhDetGtDS6c%2BfqoS4cUxPDTcpGsOUdFDgJ9H48jeQkmx6TgpK9YA5G0Gokyo4VsEcxExXL17w4ZuMNqsDk%3D)
来保持后续业务代码的 "this" 指向是上层作用域中的 "this"。
比如说，我们在一些 "wx.xx" 之类API的回调中使用：
page() {
scanCode() {
wx.scanCode({
scanType: ['qrCode'],
success: (res) => {
console.log('获取扫码结果', res);
this.setData({
qrCode: res.result
})
},
fail: (err) => {
console.log('扫码失败', err);
}
});
}
}
就不需要在外部在定义一个 "const that = this" 了。
在非小程序开发的时候也会有遇到这样的情况，也可以使用 箭头函数 改写回调函数
export default {
...
methods: {
onDeleteConfirm (id) {
const that = this;
this.$confirm({
title: "确认删除",
content: "是否删除选中文件?",
- onOk: function () {
- that.submitDeleteAction(id)
- }
+ onOk: () => {
+ this.submitDeleteAction(id)
+ }
})
}
}
}
***
很早之前 "react" 中也会使用
".bind()" (https://link.segmentfault.com/?enc=P7Bd5PPP4gWR9oQLH38Apw%3D%3D.Aqwnwq7rYNH%2B5YyDq6mWo24J8fhVv4gq15tYF1kGNkzOKC%2F%2B3lcjw1l2Xei6vV8vlx0NhWyu%2BvizIRv1aaXo4C90G5dt8Z2AWbh5PVoHUqHiLEJeJLlPzE8CYSE4q%2FXj)
或者 箭头函数 来指定 "this" 指向。
this.deleteRow(id, e)}>Delete Row
Delete Row
"Handling Events –
React" (https://link.segmentfault.com/?enc=hnEGLl4Oje%2BudOE2van4Pg%3D%3D.BOw0Ss5rmE5ZsRz1VZea3umniAn5pp75WYJNZHp8nUoTUwZ9TOODDs9fegsFt32%2FM4UiAULAqZ3iFS9xshW72MjfOeROjQ74pPlt1z%2B%2FShaZTzLzjXZ4Xeh0bjjgSt52)