el有2种写法 a、创建Vue实例对象的时候配置el属性 b、先创建Vue实例，随后再通过vm.$mount('#root')指定el的值 data有2种写法 a、对象式：data： { } b、函数式：data() { return { } } 如何选择：目前哪种写法都可以，以后到组件时，data必须使用函数，否则会报错一个重要的原则 由Vue管理的函数，一定不要写箭头函数，否则 this 就不再是Vue实例了
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<script src="js/vue.js"></script>
<script src="js/vue.min.js"></script>
</head>
<body>
<h1 id="root">
测试{{name}}
</h1>
<a href="www.jd.com">京东</a>
<script type="text/javascript">
Vue.config.devtools = true;
Vue.config.productionTip = false; //阻止 vue 在启动时生成生产提示。
// const v = new Vue({
// // el的两种写法
// // el:"#root", 第一种
// data的第一种写法：对象式
// data: {
// name: "我的第二vue",
// url: "www.baidu.com",
// datas:{
// name: "测试123",
// }
// }
// });
// v.$mount("#root") //第二种（之后在指定）
new Vue({
el: "#root",
//data的第二种写法：函数式
data(){
console.log(this); //this是Vue的实例对象
return {
name: "测试代码",
}
}
})
</script>
</body>
</html>
标签：el,Vue,name,data,root,写法
From： https://www.cnblogs.com/Horsonce/p/16798488.html