Open XueSeason opened 8 years ago
本系列文对完全不懂前端的新手可能不太友好，不保证入门曲线的平滑性。
Vue 仅仅只是一个 UI 框架，其核心思想可以分为数据响应和组件化。
数据响应
组件化
在通常命令式编程中，和视图相关的数据一旦发生改变，我们需要手动操作 DOM 来更改对应的界面。这样带来的一个问题就是，操作繁琐且易错。所谓数据响应，就是通过特定方式，将数据和视图进行绑定从而使两者达到同步的效果，当数据发生变化，DOM 能够响应更新对应的界面。这样我们减少了操作 DOM 的代码，逻辑的主要关注点是数据的变化。
了解 MVVM 的同学，就非常容易理解。Vue 实例其实就是我们所说的 ViewModel，通过 Vue 将 Model 和 View 进行绑定，从而达到响应式编程的效果。关于更多函数响应式编程的思想，我会不定期总结，一些 Vue 的数据响应细节，也会在之后讲到。
玩过乐高积木的童鞋，可以把组件想象成每一块积木，最终的项目就是通过一块块积木搭建而成。组件化在构成大型项目中是非常重要的概念。组件类似于 HTML 中的标签元素，但比标签更加强大。同样组件也有一颗类似于 DOM 的组件树。
上图对于有开发移动端或者类似的 React／Angular 等框架等童鞋是非常熟悉的。Vue 在实例化的一系列初始化步骤，通过生命周期的 hook，在某个生命阶段执行特定的代码。
作为开门见山的讲解了一些 Vue 的特性，第 0 篇点到为止，后续将深入理解。
写在前面
本系列文对完全不懂前端的新手可能不太友好，不保证入门曲线的平滑性。
关于 Vue 的初步认识
Vue 仅仅只是一个 UI 框架，其核心思想可以分为
数据响应和组件化。数据响应
在通常命令式编程中，和视图相关的数据一旦发生改变，我们需要手动操作 DOM 来更改对应的界面。这样带来的一个问题就是，操作繁琐且易错。所谓数据响应，就是通过特定方式，将数据和视图进行绑定从而使两者达到同步的效果，当数据发生变化，DOM 能够响应更新对应的界面。这样我们减少了操作 DOM 的代码，逻辑的主要关注点是数据的变化。
了解 MVVM 的同学，就非常容易理解。Vue 实例其实就是我们所说的 ViewModel，通过 Vue 将 Model 和 View 进行绑定，从而达到响应式编程的效果。关于更多函数响应式编程的思想，我会不定期总结，一些 Vue 的数据响应细节，也会在之后讲到。
组件化
玩过乐高积木的童鞋，可以把组件想象成每一块积木，最终的项目就是通过一块块积木搭建而成。组件化在构成大型项目中是非常重要的概念。组件类似于 HTML 中的标签元素，但比标签更加强大。同样组件也有一颗类似于 DOM 的组件树。
Vue 的生命周期
上图对于有开发移动端或者类似的 React／Angular 等框架等童鞋是非常熟悉的。Vue 在实例化的一系列初始化步骤，通过生命周期的 hook，在某个生命阶段执行特定的代码。
结尾
作为开门见山的讲解了一些 Vue 的特性，第 0 篇点到为止，后续将深入理解。