引入Vue
<script src="./vue2.6.14.js"></script>
创建视图
<!-- 这里使用id 表示唯一性 -->
<!-- 确定一个范围，表示此范围内部都是 vue解析出来的 -->
<div id="app">
<!-- 插值表达式 -->
{{msg1}} {{msg2}}
{{jsonval}}
{{'abcd'}}
<!-- v-on: vue的指令 可以简写为 @click -->
<h1 v-on:click="fn()">{{flag?'你真棒':'你还需要努力'}}</h1>
</div>
JS部分
<script>
/* 实例化一个vue对象 */
/* Vue开头大写表示构造函数 */
/* vm是构造函数实例化出来的对象 */
let vm = new Vue({
el:"#app",/* el属性来和视图进行绑定 */
data:{
msg1:'欢迎来到',
msg2:'vuejs的世界',
jsonval:{
"username":"张三",
"age":18
},
flag:false,
},
methods:{
/* es6 key后面有个函数 可以简写成如下的格式 */
fn(){
alert('操作成功')
}
}
});
/* data里面定义多个属性 把属性的值展示到页面中 */
</script>
