vue & lifecycle methods & this bug & ES6 Arrow function & this bind bug
vue & lifecycle methods & this bug

ES6 Arrow function & this bind bug
bad
fetchTableData: (url = ``, options = {}) => {}
// arrow function & this bind bug!
// fetchTableData: (url = ``, options = {}) => {
fetchTableData (url = ``, options = {}) {
// fetchTableData
// return Promise && async await
// let url = "http://10.1.5.202/es6-test/axios/preview-user.new.json";
if (!url) {
url = "http://10.1.5.202/es6-test/axios/preview-user.new.json";
}
let that = this;
console.log(`this =`, this);
console.log(`that =`, that);
// console.log(`this.a.data =`, this.a.data);
// Axios.post(url, options)
Axios.get(url)
.then((res) => {
let {
data: json
} = res;
if (json.data.length) {
// that.a.data.totalPage = json.data.length;
// that.a.data.allDatas = json.data;
// // pagination
// that.a.data.table = that.a.methods.getPaginationData(that.a.data.allDatas, that.a.data.currentPage, that.a.data.pageSize);
// that.$data.totalPage = json.data.length;
// that.$data.allDatas = json.data;
// // pagination
// that.$data.table = that.getPaginationData(that.$data.allDatas, that.$data.currentPage, that.$data.pageSize);
this.$data.totalPage = json.data.length;
this.$data.allDatas = json.data;
// pagination
this.$data.table = this.getPaginationData(this.$data.allDatas, this.$data.currentPage, this.$data.pageSize);
}
});
},
ES6 & class methods
OK
showInitTableData(url = ``) {
console.log(`init this =`, this);
Axios.get(url)
.then((res) => {
let {
data: json
} = res;
if (json.data.length) {
this.$data.totalPage = json.data.length;
this.$data.allDatas = json.data;
// pagination
this.$data.table = this.getPaginationData(this.$data.allDatas, this.$data.currentPage, this.$data.pageSize);
}
});
},
vue & lifecycle methods & this bug & ES6 Arrow function & this bind bug的更多相关文章
- ES6 Arrow Function & this bug
ES6 Arrow Function & this bug let accHeadings = document.querySelectorAll(`.accordionItemHeading ...
- ES6 Arrow Function All In One
ES6 Arrow Function All In One this const log = console.log; const arrow_func = (args) => log(`arg ...
- ES6 arrow function vs ES5 function
ES6 arrow function vs ES5 function ES6 arrow function 与 ES5 function 区别 this refs xgqfrms 2012-2020 ...
- ES6 Arrow Function return Object
ES6 Arrow Function return Object https://github.com/lydiahallie/javascript-questions/issues/220#issu ...
- arrow function and bind
Can you bind arrow functions? https://stackoverflow.com/questions/33308121/can-you-bind-arrow-functi ...
- ES6 arrow function
语法: () => { … } // 零个参数用 () 表示: x => { … } // 一个参数可以省略 (): (x, y) => { … } // 多参数不能省略 (): 当 ...
- [ES6] 06. Arrow Function =>
ES6 arrow function is somehow like CoffeeScirpt. CoffeeScript: //function call coffee = -> coffee ...
- js arrow function return object
js arrow function return object bug filterData: { type: Object, default: () => {}, required: true ...
- bind & this & new & arrow function
bind & this & new & arrow function this bind call apply new arrow function arrow functio ...
随机推荐
- BIO与NIO
BIO与NIO 1.传统BIO (1)特点 面向数据流 阻塞式传输 一个客户端对应一个线程 在客户机增多的情况下,线程资源随之增多,会造成cpu资源枯竭 (2)需求 客户机向服务器输出字符串,逐一 ...
- 使用winsw将spring-boot jar包注册成windows服务
背景:最近的项目中使用spring-boot, https://github.com/kohsuke/winsw/releases <service> <id>YJPSS< ...
- Make a Person-freecodecamp算法题目
Make a Person 1.要求 用下面给定的方法构造一个对象:方法有 getFirstName(), getLastName(), getFullName(), setFirstName(fir ...
- BZOJ1046: [HAOI2007]上升序列(LIS)
Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 5740 Solved: 2025[Submit][Status][Discuss] Descript ...
- 【学时总结】◆学时·VIII◆ 树形DP
◆学时·VIII◆ 树形DP DP像猴子一样爬上了树……QwQ ◇ 算法概述 基于树的模型,由于树上没有环,满足DP的无后效性,可以充分发挥其强大统计以及计算答案的能力. 一般来说树形DP的状态定义有 ...
- lintcode_111_爬楼梯
爬楼梯 描述 笔记 数据 评测 假设你正在爬楼梯,需要n步你才能到达顶部.但每次你只能爬一步或者两步,你能有多少种不同的方法爬到楼顶部? 您在真实的面试中是否遇到过这个题? Yes 哪家公司问你的 ...
- datatable中reload和load的区别
ajax.reload()用于datatable表某个数据的变化而重新加载 ajax.url(url).load() 用于切换url时,datatable重新获取数据,加载.
- 在唯一密钥属性“fileExtension”设置为“.”时,无法添加类型为“mimeMap”的重复集合项
在ASP.NET 网站的配置文件中添加了MIME类型,但是运行网站后在IIS上和页面上提示"在唯一密钥属性“fileExtension”设置为“.woff”时,无法添加类型为“mimeMap ...
- laravel查看执行的sql语句
方法一: 我们有时候想测试一段代码生产的 SQL 语句,比如: 我们想看 App\User::all(); 产生的 SQL 语句,我们简单在 routes.php 做个实验即可: //app/Http ...
- C++ 无符号整型和整型的区别
在Win 7系统中,short 表示的范围为 - 32767到 32767,而无符号的short表示的范围为0 到 65535,其他类型的同理可推导出来,当然,仅当数字不为负的时候才使用无符号类型. ...