Vue的学习笔记（1）

Vue的概念

Vue是一个用于 构建用户界面 的 渐进式 框架。

其中：

1、构建用户界面：是基于 数据 动态渲染 页面；

2、渐进式：允许我们循序渐进的学习；

3、框架：一套完整的项目解决方案，可以大大提升开发效率

创建Vue实例，初始化渲染

核心步骤：

1、准备容器（即准备一个div，该div在 Vue 所管理的范围内）

2、引入包（官网引入）- 开发版本  / 生产版本

3、创建Vue实例，new Vue()

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

        ① el 指定挂载点（通过 el 配置选择器，指定 Vue 管理的是哪个盒子）

        ② data 提供数据

插值表达式 {{ }}

插值表达式是一种 Vue 的模板语法

1、作用：利用表达式进行插值，渲染到页面中

      表达式：是可以被求值的代码，JS 引擎会将其计算出一个结果。（可以进行加减乘除，可以是对象中的某个属性的值、数组、函数等）

2、语法：{{ 表达式 }}

3、注意点：

① 使用的数据要存在；

② 只支持表达式，不支持语句，如 if、for等；

③ 不能在标签属性中使用插值表达式。

响应式特性

响应式特性是 Vue 的核心特性之一。

数据的响应式处理 → 响应式： 数据变化，视图自动更新

通俗来说：就是当我们对数据进行修改时，页面的数据会随着我们的修改而变化。

使用 Vue 开发 → 专注于 业务核心逻辑 即可

访问或修改数据

data上的数据，最终会被添加到实例上

① 访问数据： “实例名.属性值”

② 修改数据：“实例名.属性值“ = ”值”