Vue、框架与库的区别、MVVM
- 一、什么是Vue.js?
- 二、库和框架的区别
- 三、MVVM
- 四、什么是CDN加速
- 五、简单使用vue.js
一、什么是Vue.js?
Vue.js:是一套构建用户界面的渐进式的JavaScript框架;它与大型框架不同的是,vue被设计为可以自底向上的逐层应用,Vue核心库只关注视图,方便与第三库或已有的项目整合。
vue作者:尤雨溪/中国无锡
点击浏览官网
二、库和框架的区别
库:本质上是一些函数的集合。每次调用函数,实现一定的特定的功能,接着把控制权交给使用者
代表:JQuery
jQuery库核心:DOM操作,即:封装DOM操作,简化DOM操作
框架:是一套完整的解决方案,使用框架的时候,需要把你的代码放到框架适合的地方,框架会在合适的实际调用你的·代码。
代表:vue
使用规定了自己的编程方式,是一套完整的解决方案
使用框架的时候由框架控制一切,代码编写者只要按照规则写代码框架的入侵性很高从头到尾;
三、MVVM
MVVM—》M,V,VM
M—Mode数据模型
V----View视图
VM----ViewModel 视图模型
MVVM是Model-View-ViewModel的简写。它本质上就是MVC 的改进版。MVVM 就是将其中的View 的状态和行为抽象化,让我们将视图 UI 和业务逻辑分开。当然这些事 ViewModel 已经帮我们做了,它可以取出 Model 的数据同时帮忙处理 View 中由于需要展示内容而涉及的业务逻辑
注:虽然没有完全遵循MVVM模型,Vue的设计收到了它的启发,而另外一个js框架“knockout”完全遵循MVVM的设计模型,并且在学习Vue的过程中要转化思想“不要想着怎么操作DOM,二十想着如何操作数据”
四、什么是CDN加速
CDN(全称:Content Delivery Network)是构建在网络之上的内容分发网络,依靠部署在各地的边缘服务器,通过中心平台的负载均衡、内容分发、调度等功能模块;
使客户就近获取所需内容,降低网路拥塞,提高用户访问响应速度和命中率,CDN的关键技术主要有内容储存和分发技术;
CDN服务器通过缓存或者主动抓取主服务器的内容来实现资源储备;
CDN基本原理:将原站内容分发至最接近的用户的节点,使用户可就近获取所需内容,提高用户访问的响应速度和成功率。
五、简单使用vue.js
1、配置vue.js的环境
在有网络的情况下:建议直接使用cdn中的调用js的开发环境版本
不方便使用网络:就直接在官网下载vue.j的文件安装
再到html中调用即可
2、简单输出,日期·
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>简单实用vue</title>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.12/vue.js"></script>
</head>
<body>
<div id="app">
<!-- 调用vue变量 -->
<h2>ts={{data}}</h2>
</div>
</body>
<script>
/* 建一个vue实例 */
var vm = new Vue({
/* 将属性为app的空间挂载到vue实例中 */
el:"#app",
/* 定义属性并初始化属性 */
data: {
/* 属性之间用“,”隔开 */
data: new Date().getTime()
},
/* 方法的集合,任何方法都可以在这里编写 */
methods:{
}
})
</script>
</html>