vue.js mounted问题
本人新手, 买了梁灏大神的vue.js,里面的一个小例子没太看懂.是关于this的.希望大神们解答下.
完整代码在body中, 为什么要用 var _this = this, 这个this不就是指向的 vue 吗,代码中 //声明一个变量指向 Vue 实例this,保证作用域一致,是什么意思呢? 我尝试了下, 如果没写 var _this = this 的话,直接写成下面这也的话,
mounted: function () {
this.timer = setInterval(function () {
this.data = new Date()
},1000)
},
这样写的话,时间将不会刷新. 请问这是为什么呢.
<body>
<div id="app">
{{data}}
</div>
<script src="https://cdn.bootcss.com/vue/2.5.16/vue.min.js"></script>
<script type="text/javascript">
var app = new Vue({
el: '#app',
data () {
return {
data: new Date(),
}
},
mounted: function () {
var _this = this //声明一个变量指向 Vue 实例this,保证作用域一致
this.timer = setInterval(function () {
_this.data = new Date()
},1000)
},
beforeDestroy: function () {
if (this.timer) {
clearInterval(this.timer)
}
}
})
</script>
</body>
沧海一幻觉2回答
-
侃侃无极
这是个跟vue没有关系的问题。涉及到this的指向的一个问题，你去搜this的四种调用（还有别的种类，但是先搜这个）搜完之后继续往下看：然后这里的setInterval(function () { this.data = new Date() },1000)this是属于setInterval的回调函数的，属于直接调用，指向谁？最后希望你先学js基础。官方指南假设你已了解关于 HTML、CSS 和 JavaScript 的中级知识。 -
holdtom
这是js中作用域的问题跟vue没关系，在学vue之前还是要好好的了解下js原理。建议去看看js权威指南。
随时随地看视频慕课网APP
相关分类
JavaScript