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的更多相关文章

  1. ES6 Arrow Function & this bug

    ES6 Arrow Function & this bug let accHeadings = document.querySelectorAll(`.accordionItemHeading ...

  2. ES6 Arrow Function All In One

    ES6 Arrow Function All In One this const log = console.log; const arrow_func = (args) => log(`arg ...

  3. ES6 arrow function vs ES5 function

    ES6 arrow function vs ES5 function ES6 arrow function 与 ES5 function 区别 this refs xgqfrms 2012-2020 ...

  4. ES6 Arrow Function return Object

    ES6 Arrow Function return Object https://github.com/lydiahallie/javascript-questions/issues/220#issu ...

  5. arrow function and bind

    Can you bind arrow functions? https://stackoverflow.com/questions/33308121/can-you-bind-arrow-functi ...

  6. ES6 arrow function

    语法: () => { … } // 零个参数用 () 表示: x => { … } // 一个参数可以省略 (): (x, y) => { … } // 多参数不能省略 (): 当 ...

  7. [ES6] 06. Arrow Function =>

    ES6 arrow function is somehow like CoffeeScirpt. CoffeeScript: //function call coffee = -> coffee ...

  8. js arrow function return object

    js arrow function return object bug filterData: { type: Object, default: () => {}, required: true ...

  9. bind & this & new & arrow function

    bind & this & new & arrow function this bind call apply new arrow function arrow functio ...

随机推荐

  1. CTS、CLS、CLR分别作何解释?

    CTS.CLS.CLR分别作何解释? 答:CTS:通用类型系统.CLS:通用语言规范.CLR:公共语言运行库.

  2. caffe中的sgd,与激活函数(activation function)

    caffe中activation function的形式,直接决定了其训练速度以及SGD的求解. 在caffe中,不同的activation function对应的sgd的方式是不同的,因此,在配置文 ...

  3. Spring详解篇之IoC控制反转

    ###一.Spring概况 spring是一个开源框架 是一个轻量的控制反转和面向切面的容器框架 大小和开销都是轻量的. 通过控制反转技术可以达到松耦合的目的 切面编程,允许通过分离应用的业务逻辑. ...

  4. iOS圆角view的Swift实现(利用Core Graphics绘制)

    iOS圆角view的Swift实现(利用Core Graphics绘制) 因为app的列表用用到了圆形图片的头像,所以去探究并思考了一下这个问题.首先这个问题有两个方向的解决方案: 把图片弄成圆形的. ...

  5. 用struct LNode *L与LinkList &L的区别

    用void InitList(struct LNode *L), 函数InitList中如果改变了L指针本身的值,对其他函数无影响.用void InitList(LinkList &L),函数 ...

  6. C++使用GDI+实现图片格式转换

    主要是我在设置壁纸时遇到的个小问题,因为设置壁纸只能是bmp格式的图片,不可能我喜欢的壁纸就都是bmp格式的,就想怎么转换一下图片的格式,于是就在百度搜怎么弄,搜到了可行方法,却没有实现代码,有些看起 ...

  7. Linux下 tar 命令详解

    tar 是 unix/linux下的打包器 [解压] 输入命令: # tar  -zxvf  filename.tar.gz 参数解释: z :表示 tar 包是被 gzip 压缩过的 (后缀是.ta ...

  8. ES6笔记01-声明变量

    ES6只有六种声明变量的方法:var命令和function命令,let和const命令,import命令和class命令.所以,ES6一共有6种声明变量的方法. const声明一个只读的常量.一旦声明 ...

  9. Python容器--list, tuple, dict, set

    ## Python 中有四种用于存放数据的序列--list, tuple, dict, set ## list 列表 - 可以存放任意类型数据的有序序列 - 列表可以由零个或多个元素组成,元素之间用逗 ...

  10. 【PHP】Maximum execution time of 30 seconds exceeded解决办法

    Maximum execution time of 30 seconds exceeded,今天把这个错误的解决方案总结一下: 简单总结一下解决办法: 报错一:内存超限,具体报错语句忘了,简单说一下解 ...