标签：el Vue name data root 写法
el与data的两种写法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>el与data的两种写法</title>
<script src="../js/vue.js"></script>
</head>
<body>
<!--
data与el的两种写法
1、el有两种写法
（1）new Vue 的时候配置el属性
（2）先创建Vue实例，然后再通过 vm.$mount('#root') 指定el的值
2、data有两种写法
（1）对象式
（2）函数式
如何选择：目前哪种写法都可以，以后学习到组件时，data必须使用函数式，否则会报错
3、一个重要的原则
由Vue管理的函数，一定不要写箭头函数，一旦写了箭头函数，this就不是Vue实例了
-->
<div id="root">
<h1>你好，{{name}}</h1>
</div>
<script>
//el的两种写法
// const v = new Vue({
// //el:'#root', //第一种写法
// data:{
// name:'尚硅谷',
// }
// })
// console.log(v)
// v.$mount('#root') //第二种写法
//data的两种写法
new Vue({
el:'#root',
//data的第一种写法：对象式
// data:{
// name:'尚硅谷',
// }
//data的第二种写法：函数式
data(){
console.log('@@@',this) //此处的this是Vue实例对象
return{
name:'尚硅谷'
}
}
})
</script>
</body>
</html>
标签：el,
Vue,
name,
data,
root,
写法
From： https://www.cnblogs.com/tanhongwei/p/17037471.html