Vue.js mounted problem

I am a novice. I bought a small example in Liang Hao"s vue.js,. It"s about this. I hope the gods will answer.
complete code in body, why not use var _ this = this, this this is to point to the vue, the code / / declare a variable pointing to the Vue instance this, to ensure scope consistency, what does it mean? I tried it, and if I didn"t write var _ this = this, I just wrote it as follows,

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: "-sharpapp",
        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 >

Mar.04,2021

this is a problem that has nothing to do with vue.
involves a problem with the direction of this. You search for this four calls (there are other kinds, but search this first)
and then move on to:
and then the

here.
setInterval(function () {
    this.data = new Date()
},1000)

this belongs to the callback function of setInterval. It belongs to the direct call. Who does it point to?

finally, I hope you will learn the basics of js first.

The
official guide assumes that you already have intermediate knowledge of HTML, CSS, and JavaScript.

this is a scope problem in js. It has nothing to do with vue. Before you learn vue, you should have a good understanding of js principles. It is recommended to take a look at the authoritative guide to js.

Menu