文章4：vue（1）

leeon 发布于2019-08-26 12:24 / 2622人阅读

摘要：一前言概述前言最进刚刚了解了前端的三大框架，简单谈谈对三大框架的认识对于，目前在国内十分受欢迎，国外还是比较喜欢其他框架，国内也有许多公司使用。了解一门框架首先知道为什么产生，框架是什么样是东西，为什么需要用到他以及如何正确用好它。

一、前言概述

前言：最进刚刚了解了前端的三大框架vue、angular、react，简单谈谈对三大框架的认识；

对于vue，目前在国内十分受欢迎，国外还是比较喜欢其他框架，react国内也有许多公司使用。了解一门框架首先知道为什么产生，框架是什么样是东西，为什么需要用到他以及如何正确用好它。

vue是一个渐进式的框架：渐进式就是不需要使用vue提供所有的功能，比如任何一个html文件只需要引入vue.js文件就可以使用vue的功能（vue有哪些功能，等下一一介绍），引入vue.js文件就相当于为该html文件中添加一个Vue对象；

Vue对象：Vue对象中包含两个部分（1）Vue()构造函数，可以通过该方法生成无数个Vue的实例;(2)prototype原型对象：该对象中存在许多个实例方法，也即Vue的任何一个实例都可以使用原型对象中方法

vue的实现的原理：采用的是MVVM设计模式实现三部分：

model：模型中存储的都是数据

view ：视图中显示数据

modelview：实现业务逻辑处理

两大核心系统：监听系统与虚拟DOM树

监听系统：vue框架为model（也即就是下方代码中data中的数据）中的变量都添加了一对get/set方法，有点类似es5中的访问器属性【访问器属性不能直接定义，要通过Object.defineProperty()这个方法来定义。】，当试图修改model中的数据时，vue自动调用set方法，获取数据时，又自动调用get方法

虚拟DOM树：当试图修改model中的数据时，此时虚拟DOM树要做的事就是遍历虚拟DOM树找出视图中绑定该数据的部分，并且更新真实DOM树（前提：该DOM树必须被监视（如下方的代码中：el:"#app"）,也即就是只有在id为app的节点下的节点被监视

//代码：
var vm = new Vue({
el:"#app",
data:{
uname:"field",
age:20
},
methods:{

}
})

未完待续（第一次写文章给自己看的）

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108652.html

基于Vue,Vue-router,Vuex的简书网站模仿(二)

摘要：通过点击事件来更换不同的值和文章内容。文章排版整洁，注意诗游戏玩转简书的第一步，从这个专题开始。专题主编苏锦年投稿须知本专题收录古诗词现代诗以及诗词点评及指导。内容必须为原创，切勿用其他诗人的诗句。接着上一篇我们接着讲,关于这个网站的专题页面和2015精选页面，如果有小伙伴没看过上一篇文章，这里附上上一篇文章的的链接基于Vue,Vue-router,Vuex的简书网站模仿这里是网站的...

yibinnn 2019-08-22 10:37 评论0 收藏0
Vue + TypeScript + Element 项目实践(简洁时尚博客网站)及踩坑记

摘要：前言本文讲解如何在项目中使用来搭建并开发项目，并在此过程中踩过的坑。具有类型系统，且是的超集，在年势头迅猛，可谓遍地开花。年将会更加普及，能够熟练掌握，并使用开发过项目，将更加成为前端开发者的优势。 showImg(https://segmentfault.com/img/remote/1460000018720573); 前言本文讲解如何在 Vue 项目中使用 TypeScript...

luckyyulin 2019-08-26 13:39 评论0 收藏0
王下邀月熊_Chevalier的前端每周清单系列文章索引

摘要：感谢王下邀月熊分享的前端每周清单，为方便大家阅读，特整理一份索引。王下邀月熊大大也于年月日整理了自己的前端每周清单系列，并以年月为单位进行分类，具体内容看这里前端每周清单年度总结与盘点。感谢王下邀月熊_Chevalier 分享的前端每周清单，为方便大家阅读，特整理一份索引。王下邀月熊大大也于 2018 年 3 月 31 日整理了自己的前端每周清单系列，并以年/月为单位进行分类，具...

2501207950 2019-08-22 14:53 评论0 收藏0