Day01-Vue的基本格式

创建Vue实例传入的options

我们在创建Vue的时候，会传入一个对象options
这个options包含哪些选项？
目前掌握这些选项

• el:
  类型：string | HTMLElement（表示HTML中的一个元素）
  作用：决定之后的Vue实例会管理哪一个DOM。
• data：
  类型：Object | Function(组件当中data必须是个函数)
  作用：Vue实例对应的数据对象
• methods：
  类型：{[key：string]：Function}
  作用：定义属于Vue的一些方法，可以在其他地方调用，也可以在指令中使用

const a = new Vue({
    el:'#app',
    //el:document.querySelector("#app"),
    data:{
        counter:0
    },
    methods:{
        add:function () {
            console.log('添加被执行')
            // counter++   找不到counter(局部变量)
            this.counter++
        },
        sub:function () {
            this.counter--
            console.log('减小被执行')

        }
    }
})

开发中什么时候叫方法什么时候叫函数？
方法：method
函数：function
在类里面的一般叫方法
在外面的一般叫函数

生命周期

Vue生命周期
当进行到某 一阶段的时候Vue内部会回调函数

//生命周期函数（钩子函数hook）
beforeCreate: function () {
},
created:function () {
    console.log('created')
},
mounted:function () {
    console.log('mounted')
}

Vue template

创建一个Vuetemplate