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,到底指向谁了,希望能帮助到其他人。


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM