当前位置: 移动技术网 > IT编程>脚本编程>vue.js > Vue中使用 setTimeout() setInterval()函数的问题

Vue中使用 setTimeout() setInterval()函数的问题

2018年09月23日  | 移动技术网IT编程  | 我要评论

中国武器,台州互联星空棋牌,山东高考网上报名

在vue点击事件调用函数的过程中,想通过 settimeout() setinterval()函数来延迟修改参数时,发现函数没有执行,控制台也没有报错,代码如下:

var vm_target = new vue({
        el: '#vm_target',
        data: {
          clicksubmitbtn:false
        },
        methods:{
          myfunc:function(){
            settimeout(function(){
            this.clicksubmitbtn = true; //此处修改data中的参数时无效
            },500);
          }
        }
       }) 

 之后在调试的时候,发现,settimeout()函数中的 this 指向的并非vue对象,将this.clicksubmitbtn = true; 修改为 vm_target.clicksubmitbtn = true;之后 ,代码便可以正常执行。

var vm_target = new vue({
        el: '#vm_target',
        data: {
          clicksubmitbtn:false
        },
        methods:{
          myfunc:function(){
            settimeout(function(){
            vm_target .clicksubmitbtn = true; //修改此处
            },500);
          }
        }
       })

补充:下面看下vue settimeout--延迟操作

有时候我们在查询后要做某些事情,例如我查询的时候要根据某个值再去查询某些东西并和这些值一起显示的时候,我们可以对渲染数据的操作进行延迟,因为代码执行的速度是很快的而访问数据的操作先对于渲染的速度慢得多,所以往往数据还没查询到而数据就渲染完成了

settimeout(() =>{
  要延迟的代码
},延迟时间);

总结

以上所述是小编给大家介绍的vue中使用 settimeout() setinterval()函数的问题 ,希望对大家有所帮助

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网