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. 数据库可视化工具简介以及pymysql的使用

    1.可视化工具Navicat 我们自己开发测试时,可以使用该可视化工具,以图形界面的形式操作数据库 在生产环境中,为了显示自己的逼格,一般不建议使用它 官网下载:https://www.navicat ...

  2. angular2中一种换肤实现方案

    思路:整体思路是准备多套不同主题的css样式.在anguar项目启动时,首先加载的index.html中先引入一套默认的样式.当我们页面有动作时再切换css.  可以通过url传参触发,也可以通过bu ...

  3. SQL基础语句汇总

    连接数据库 1 mysql -h10.20.66.32 -uroot -p123456 -h后面是mysqlServer所在地址,-u后面是用户名,-p后面是密码 查看数据库 1 show datab ...

  4. ES6学习(三):数组的扩展

    chapter08 数组的扩展 8.1 扩展运算符 8.1.1 扩展运算符的含义 ... 如同rest运算符的逆运算,将一个数组转换为用逗号分隔的参数序列. console.log(...[1, 2, ...

  5. 【例题收藏】◇例题·II◇ Berland and the Shortest Paths

    ◇例题·II◇ Berland and the Shortest Paths 题目来源:Codeforce 1005F +传送门+ ◆ 简单题意 给定一个n个点.m条边的无向图.保证图是连通的,且m≥ ...

  6. LeetCode977. 有序数组的平方

    问题:977. 有序数组的平方 给定一个按非递减顺序排序的整数数组 A,返回每个数字的平方组成的新数组,要求也按非递减顺序排序. 示例 1: 输入:[-4,-1,0,3,10] 输出:[0,1,9,1 ...

  7. linux系统的启动过程简要分析

    接触linux系统运维已经好几年了,常常被问到linux系统启动流程问题,刚好今天有空来梳理下这个过程:一般来说,所有的操作系统的启动流程基本就是: 总的来说,linux系统启动流程可以简单总结为以下 ...

  8. MySQL字段属性介绍

    引言 这次Qi号分享MySQL字段属性简介.下面资料是Qi号搜集大量资料与个人理解的整理. MySQL提供了一组可以赋给表中各个列的数据类型,每个类型都强制数据满足为该数据类型预先确定的一组规则,例如 ...

  9. 722. Remove Comments

    class Solution { public: vector<string> removeComments(vector<string>& source) { vec ...

  10. c语言可变参数函数

    c语言支持可变参数函数.这里的可变指,函数的参数个数可变. 其原理是,一般情况下,函数参数传递时,其压栈顺序是从右向左,栈在虚拟内存中的增长方向是从上往下.所以,对于一个函数调用 func(int a ...