Vue ，hello world!
1、框架介绍
1.1 MVVM框架
MVVM模式是由经典的软件架构MVC衍生来的。当Vue（视图层）变化时，会自动更新到ViewModel(视图模型)，反之亦然View和ViewModel之间通过双向绑定（data-binding）建立联系。
MVVM框架：Angular.js、react.js、vue.js
- Model:负责数据存储，用数据来标识模型；（数据访问层）
- View:负责页面显示，用户所看到的界面
- View Model：负责业务逻辑处理（比如Ajax请求等），对数据进行加工后交给视图展示。ViewModel就是view和model连接器，view与Model通过ViewModel实现数据双向绑定。
取代了MVC模式的controller,或MVP模式的任命者（presenter）。数据驱动传达和数据绑定的通信。
使用MVVM模式有几大好处：
- 低耦合。View可以独立于Model变化和修改，一个ViewModel可以绑定到不同的View上，当View变化的时候Model可以不变，当Model变化的时候View也可以不变。
- 可重用性。可以把一些视图的逻辑放在ViewModel里面，让很多View重用这段视图逻辑。
- 同步开发。开发人员可以专注与业务逻辑和数据的开发(ViewModel)。设计人员可以专注于界面(View)的设计。
- 可测试性。可以针对ViewModel来对界面(View)进行测试
1.2 MVC（Model-View-Controller）
-
简介
界面视图被分到了View，数据被分到了载体Moedel上有Model"携带"，业务集中在Controller（控制器）中，而推动业务的时间由用户与view交互，通过view向controller发动。将内部数据与用户界面相分离，从而实现高效的代码复用和并行开发。 -
MVC一般流程：
view(界面)用户触发事件----controller（业务）处理业务，然后触发事件----更新model数据----model（带着数据）回到view-----view设计更新了 -
优点
- 高内聚：MVC可以在控制器上对相关操作进行逻辑分组。特定模型的视图也组合在一起
MVC将应用程序的各个组件分离，因此前端、后端开发能够在不同组件上并行工作，互不影响。后端设计人员可以设计数据结构以及用户如何与之交互，无需完成一个用户界面；前端开发人员能够在数据结构可用之前设计和测试应用程序的布局。 - 代码重用：通过独立的组件，开发人员能够在其他应用程序中快速的充用重用组件。
- 高内聚：MVC可以在控制器上对相关操作进行逻辑分组。特定模型的视图也组合在一起
1.3 MVP（Model-View-Presenter）
对MVC改进的思想是，切断View和model的联系，让view只和presenter（原controller）交互，减少再需求变化中需要维护的对象的数量。
MVVM比起MVP，MVVM不仅简化了业务与界面的依赖关系，还优化了数据频繁更新的解决方案，甚至可以说提供了一种有效的解决模式
2、Vue介绍
Vue.js：简单小巧的技术黑犀牛，渐进式技术栈，足应付任何规模的应用。组件化，模块化开发方式。
提供了现代Web开发中常见的高级功能，比如：
• 解耦视图，数据
• 可复用组件
• 前端路由
• 状态管理
虚拟DOM( Virtual DOM)
Vue核心概念：数据驱动，避免手动操作DOM，以便更多时间关注数据的业务逻辑，而不是DOM该如何渲染。
props传递数数据，events触发事件，和slot内容分发，构成了vue组件的3个API来源。
3、使用方法
1.1. 引入vue.js
开发版本下载地址
直接下载并在index.html文件中用<script>标签引入vue.js，Vue会被注册为一个全局变量。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="vue.js" type="text/javascript" charset="UTF-8"></script>
</head>
<body>
</body>
</html>
在开发环境下不要使用压缩版本，不然你会失去常见错误先关的警告。开发版本包含完整的警告和调试模式。
1.2 使用CDN
链接到一个明确的版本号和构建文件，以避免新版本造成的不可预期的破坏。
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
1.3 NPM
Vue构建大型项目用NPM安装模块。
由于npm安装速度慢，一般使用淘宝的镜像及其命令cnpm，
npm install vue
1.4 命令行工具(CLI)
对Node.js和相关构建工具有一点的了解者使用，新手不推荐。
为单页面应用快速搭建繁琐的脚手架。
1035
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
