模版template

我们查看生命周期这一部分，有一个 outer HTML，并说将outer html 编译为 template
那么outer html 具体是什么呢？

以下两个阶段是形成虚拟DOM 和 真实DOM的阶段

生命周期里面还有一个地方需要注意
我们看下面这条线是怎么走的

里面提到了template option ，这个部分是哪个地方呢？

那么这里我们可以引入template

但是这样会报错

使用template只能有一个root element
上图中我们的h3 和 button 是两个 root element
所以我们可以在他俩上面增加一层div

<script type="text/javascript">
    var vm = new Vue({
        el:"#app",
        template: `
        <div>
            <h3> {{ mycount }}</h3>
            <button @click="adds"> 增加</button>
        </div>
        `,
        data:{
            mycount : 1,
        },
        methods:{
            adds(){
                this.mycount ++
            }
        },
    })
</script>