Vue.js的代码结构

a)         引入vue.js

b)         写视图层，我们要展示的内容

c)         实例化Vue()

• data：存放数据
• el：这个控制是哪块视图
• methods：放我们的方法

示例

<!-- 视图层 -->
<div id="app">
    <!-- 插值表达式，可以读取我们的变量 -->
    {{ message }}
</div>

<!-- 1、引入vue的js，引入js之后他为我们提供了Vue类 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    // 调度层
    var vm = new Vue({
        // vue控制的区域
        el: '#app',
        // data参数存放我们的数据，这一层就是mvvm里的model层
        data: {
            message: 'Hello Vue!'
        },
        methods: {

        }
    })
</script>