Vue--1.2创建一个Vue实例

核心步骤：

1.准备容器

2.引包（官网）-开发版本（开发过程中使用）/生产版本（上线后使用）

官网：

1)vue2:Vue.js

2)vue3:Vue.js - 渐进式 JavaScript 框架 | Vue.js

开发版本：

<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script>

生产版本：

<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14"></script>

3.创建Vue实例 new Vue（）

4.指定配置项->渲染数据

1)el指定挂载点

2)data提供数据

<div id="app">
{{msg}}
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.10/dist/vue.js"></script>
<script>
    const app=new Vue({
        el:'#app',
        data:{
            msg:'Hello'
        }
    })
</script>

响应式特性

响应式数据：数据变化了，视图自动更新。

data中的数据是会被添加到实例上。

1.访问数据  实例.属性名

2.修改数据  实例.属性名=新值