GitHub账号 :http://github.com/yyx990803
官方入门 :https://cn.vuejs.org/
vue 2.0API 文档 :https://cn.vuejs.org/v2/guide/
vue 3.0APl 文档 :https://www.vue3js.cn/docs/zh/
GitHub 库 :https://github.com/vuejs/vue
2.1 什么是Vue(官方给出的概念:Vue是一套用于构建用户界面的前端框架)
1.构建用户界面
(1)用vue往页面中填充数据 非常的方便
2.框架
(1)框架是一套现成的解决方案 程序员只能遵守框架的规范 去编写自己的业务功能!
(2)要学习Vue 就是在学vue 框架中规定的用法
(3)vue的指令 组件 (是对UI结构的复用) 路由 Vuex vue组件库
只有把上面罗列的内容掌握以后 才有开发Vue 项目的的能力 !
2.2 vue框架的特性 主要体现如下两方面:
(1)数据驱动视图(数据的变化会驱动视图的更新)
①在使用了Vue的页面中 vue会监听数据的变化 从而自动重新渲染页面的结构 示意图如下:
好处:当页面数据发生变化时 页面会自动重新渲染(自动更新)
程序员只管把数据维护好 那么页面结构会被vue自动渲染出来
注意:数据驱动视图是单项数据绑定
(2)双向数据绑定
**在网页中,form表单 负责采集数据 ,Ajax负责提交数据**
页面上表单采集发数据发生变化是 会被vue自动获取到 并更新到js数据中
①在填写表单时 双向数据绑定可以赋值开发者在不操作 DOM的前提下 自动把用户填写内容同步到数据源中 示意图如下:
好处:开发者不再需要动手操作DOM元素 来获取表单元素的最新的值
2.3 MVVM
1.MVVM是vue实现数据驱动视图和双向数据绑定的核心原理。MVVM 指的是 Model View 和
ViewModel 它把每个 HTML 页面拆分成了这三个部分,如图所示:
2.4 MVVM 的工作原理:
注意:数据驱动视图和双向数据绑定的底层原理 MVVM (Mode 数据源,View 视图,ViewModel就是vue的实例
工作原理如图: