谈谈对vue的理解

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/wangxinxin1992816/article/details/80843397

一、 MVVM是什么?

MVVM是Model-View-ViewModel的简写, 一种新型架构框架。

View一般就是我们平常说的HTML文本的Js模板,里面可以嵌入一些js模板的代码;
ViewModule层里面就是我们对于这个视图区域的一切js可视业务逻辑,举个例子,比如图片走马灯特效,比如表单按钮点击提交,这些自定义事件的注册和处理逻辑都写在ViewModule里面;Model就是对于纯数据的处理,比如增删改查,与后台CGI做交互;

MVVM是将“数据模型数据双向绑定”的思想作为核心,因此在View和Model之间没有联系,通过ViewModel进行交互,而且Model和ViewModel之间的交互是双向的,因此视图的数据的变化会同时修改数据源,而数据源数据的变化也会立即反应到View上。
这里写图片描述
特点:
1. View的变化会自动更新到viewModel;
2. viewModel的变化也会自动同步到view上显示;
3.这种同步是因为viewModel中的属性实现了observer(观察者);
4.当属性变更都能触发对应的操作;

二、 Vue.js是什么?

Vue.js不是一个框架——它只聚焦视图层,是一个构建数据驱动的web界面的库。
特性:
1. 轻量
体积小,不依赖其他基础库;
2. 数据绑定
3. 指令
类似AngularJS 可以用一些内置的简单指令(v-*),也可以自定义指令,通过对应表达式的值的变化就可以修改对应的Dom;
4. 插件化
Vue的核心不包含Router,Ajax表单验证,但可方便地加载对应的插件。

三、 如何使用Vue.js

使用npm安装,具体构建方法已总结文档——《vue开发环境搭建》,请参阅。

四、 主要技术与版本

运行环境
ie9+,及主流浏览器
主要技术与版本
• nodejs ^8.0.0
• vue-cli ^2.8.0
这是官方首推的脚手架,可以搭建,vue-loader,webpack,browserify,热部署,单元测试,e2e测试,等一系列功能;
• vue ^2.3
更关注视图层面;开发人员不用花很多的时间在dom元素操作上;
• vue-router ^2.0.1
处理项目路由,router实现部分做的比较好,实际开发中我们更多的只需要关注配置就好了;
• vuex ^2.0.0
是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。
• webpack ^2.1.0
Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。webpack主要处理的纬度是js文件,而对比之下grunt和gulp处理的是用户任务。Webpack我们主要用于项目的开发,以及发布,是编译vue必不可少的工具,另外,webpack的热部署也是js开发中的神器,能够大大提高我们质量和效率。
• babel-core ^6.0.0
是一个广泛使用的转码器,可以将ES6代码转为ES5代码,从而在现有环境执行, 你可以现在就用 ES6 编写程序,而不用担心现有环境是否支持
• less ^2.7.2
• element-ui ^1.3.7
• axios ^0.16
是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。
• vue-i18n ^7.0.5
用于多语言开发,算是资料比较全的一个组件(但没有中文文献)

主要编辑器
vscod

展开阅读全文

没有更多推荐了,返回首页