箭头函数中的this指向是固定不变(定义函数时的指向),在vue中指向vue;
普通函数中的this指向是变化的(使用函数时的指向),谁调用的指向谁。
 
箭头函数:
 let timerOne = setInterval(() => {
    console.log(this);// vue
}, 1000);
let timerTwo = setInteval(function () {
    console.log(this); // window,因为setInterval()函数是window对象的函数
}, 1000);
打印结果:
 
 let timer = setInterval(() => {
  this.myFunc();
},1000);
myFunc(){
  console.log('sunyu is handsome !');
}
不用箭头函数也可以搞定:
 myFunc(){
  console.log(vm.name);// name为已经在created中声明的变量
};
let vm = this;
let timer = setInteval(function () {
       myFunc();
}, 1000) ;
最后温馨提示不要忘了清除定时器哦!
 

vue中使用定时器时this指向的更多相关文章

  1. vue中使用定时器时this指向问题

    在写一个很小的demo时,用的普通函数写法,没有用es6箭头函数,发现this变化了,后来查找到了问题所在: 箭头函数中的this指向是固定不变(定义函数时的指向),在vue中指向vue 普通函数中的 ...

  2. VUE中集成echarts时 getAttribute of null错误

    错误 错误场景一: 错误提示: 在运行Vue项目时出现了上述错误,出现该错误的原因是Echarts的图形容器还未生成就对其进行了初始化所造成的,代码如下: // 基于准备好的dom,初始化echart ...

  3. vue中prop传值时加不加v-bind(冒号:)

    前言:有关Vue中父组件通过prop传值给子组件时,是否加v-bind的问题,没弄清楚时感觉很乱,弄清楚之后很简单. 由于结果记起来很容易,所以先给出结果: 只有传递字符串常量时,不采用v-bind形 ...

  4. vue中使用swiper-slide时,循环轮播失效?

    前言 vue 项目中使用时,组件swiper-slide 如果用v-for循环的话,loop:true 就不能无缝轮播,每次轮播到最后一张就停止了??? 正文 代码如下: <swiper :op ...

  5. 记录在vue中使用jsx时踩过的坑

    使用方法及细节就不一一说了. 1.给input或者textarea绑定value时,出现失效的问题.解决方法:https://github.com/vuejs/babel-plugin-transfo ...

  6. vue中清除定时器

    1.data中定义 timer:90,timeName:null 点击支付则倒计时按钮出来 pay(){ this.timeName= setInterval(()=>{ this.timer- ...

  7. Vue中使用定时器setInterval和setTimeout

    js中定时器有两种,一个是循环执行setInterval,另一个是定时执行setTimeout 一.循环执行(setInterval) 顾名思义,循环执行就是设置一个时间间隔,每过一段时间都会执行一次 ...

  8. vue中使用ts时如何导入mixins

    方法一 // mixins.ts import { Vue } from "vue-property-decorator"; export class TableSelect ex ...

  9. vue中刷新页面时去闪烁,提升体验方法

    首先在最外层div添加v-if="isReloadAlive",并创建变量isReloadAlive = true 随后添加provide()以及reload方法,如下: expo ...

随机推荐

  1. 并查集问题hdu 1232

    Problem Description 某省调查城镇交通状况,得到现有城镇道路统计表,表中列出了每条道路直接连通的城镇.省政府“畅通工程”的目标是使全省任何两个城镇间都可以实现交通(但不一定有直接的道 ...

  2. win7用驱动精灵安装了bcm94352ac蓝牙驱动后还是不能用蓝牙的解决方法

    驱动精灵安装了驱动后,设备管理器处显示Bluetooth USB,但是没法用蓝牙,找不到蓝牙图标,后来在华硕官方下载了win7的Broadcom 蓝牙驱动程序装上之后就好了

  3. CocoaPods - 发布自己的模块(公有库、私有库)

    CocoaPods发布框架到远程公有库 1.编写代码~上传远程仓库 git init git add . git commit -m '提交到本地分支' //关联远程仓库 git remote add ...

  4. 对于Element-ui分页进行再次的封装使用

    这是我项目的分页的目录结构,话不多说,直接上代码. <template> <div class="pagination-container"> <el ...

  5. Mac命令行指定特定程序打开文件

    如果文件已被指定默认程序 open httpd.conf 指定一个特定程序打开文件 # 用 sublime text 打开 httpd.conf open -a /Applications/Subli ...

  6. WCF Restful Service

    对 Web Services.WCF 和 Restful 的扫盲可参见:https://www.cnblogs.com/scy251147/p/3382436.html 关于之前对 WCF 的学习,可 ...

  7. HttpContext & HttpRuntime

    问题引出 HttpContext.Current.Cache .VS. HttpRuntime.Cache HttpRuntime.Cache:获取当前应用程序的Cache HttpContext.C ...

  8. 别人家的java语言编写的自动化测试系统

    https://gitee.com/testdevops/easyrest 但是我还不会用 ~~~~(>_<)~~~~ 目前的状况是:大概知道流程了,可是第一个用例就跑步起来 自己想写一些 ...

  9. sql网址

    w3school版 https://www.w3school.com.cn/sql/index.asp 菜鸟教程版 https://www.runoob.com/sql/sql-tutorial.ht ...

  10. Bcompare 提示 “这个授权密钥已被吊销” 解决方法

    Bcompare 提示 “这个授权密钥已被吊销” 解决方法 打开文件夹 %appdata%\Scooter Software 找到相应的版本,例如 Beyond Compare 3 删除里面的 BCS ...