vue笔记：el和data的两种写法

1、el的两种写法：

①：new vue的时候直接配置el属性

②：先创建vue实例，随后再通过vm.$mount( '#root' )指定el的值

<div id="root">

    <h1>你好，{{name}} </h1>

</div>

<script type="text/javascript">

    new vue({
        el:'#root',
        data:{
            name:"大华"
    }
})

</script>

//第二种写法
<script type="text/javascript">

    const v = new vue({
        data:{
            name:"大华"
}

})
console.log(v)
v.$mount('#root')

</script>

2、data的两种写法

①：对象式 data:{}

②：函数式 data = function(){}

如何选择：学习到组件的时候，data必须使用函数式，否则会报错

new vue({

el:'#root',

data:{

name:"大华"

}

//第二种写法

data:function(){

return{

    name:"大华"

}
}

})

（3）由vue管理的函数，一定不要写箭头函数，一旦写了箭头函数，this就不再是vue实例了