zoukankan      html  css  js  c++  java
  • VUE 中使用 setTimeout() setInterval()函数的问题

    在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);
                        }
                    }
                 })
    

     看来之后还需要详细的去了解JS中的this,到底指向谁了,希望能帮助到其他人。

  • 相关阅读:
    浏览器对象
    内置对象(Date String Math Array)
    事件
    流程控制语句
    数组
    控制类名(className属性)
    显示和隐藏(display属性)
    改变HTML样式
    通过ID获取元素
    【iOS 入门】网络api
  • 原文地址:https://www.cnblogs.com/liangjing-yy/p/9019687.html
Copyright © 2011-2022 走看看