了解vue的第一天

70 阅读2分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第1天,点击查看活动详情juejin.cn/post/714765…

什么是vue?

vue是是一套用于构建用户界面UI的渐进式的js框架。与其他大型框架不同的是,vue被设计为可以自底向上逐层应用。vue的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。(可以不全用vue,这也是它的不同点)。另一方面,当与现代化的工具链以及各种支持类库相结合使用时,vue也能完全能为复杂的单页应用SPA提供驱动!

如何理解渐进式?

其实每个框架都有自己的思想主张,vue它可以很轻松的和已有的项目(比如:原生js项目)进行整合,这种特征被称为渐进式。它可以按需使用vue全家桶。

vue.js的特性

1.MVVM模式

微信图片_20220928235216.jpg ViewModel:负责整个组件的功能实现(做一些逻辑运算等)
ViewModel操作的结果都要渲染到view上。它们之间的关系是双向绑定的,通过用户交互行为产生事件(点击事件等),运行逻辑,逻辑结果的改变,组件更新渲染到视图上。
model:主要是用来提供数据的,从后台请求回来的数据存储到model里面。ViewModel向model发布指令,让其传值。两者不是双向绑定关系。
view与model之间通过ViewModel传递。
view不部署任何业务逻辑(比如:循环,判断等),只负责显示,被称为‘被动视图(Passive View)’,既没有任何主动性,非常薄!
ViewModel非常厚,所有逻辑部署(指定,事件,dom监听)都在这里!
还有其他的模式:\

微信图片_20220929000813.jpg 2.组件化
在大型的应用中,为了分工、复用和可维护性,我们不可宾冕地需要将应用抽象为多个相对独立的模块,在较为传统的开发模式中,我们只有在考虑复用时才会将某一部分做成组件,但实际上,应用类UI 完全可以看做是全部由组件树构成的。
因此,在vue的设计中将组件作为一个核心概念。可以说,每一个vue应用都是围绕着组件来开发的。
3.指令系统
即封装了能通过html(虚拟dom)中的属性来调用(其实内部封装的还是函数),直接在html添加自定义的属性(扩展的html属性),来完成一些操作,这种叫做指定系统!(生成虚拟dom时调用,为了区分在vue中指令带有前缀V-,以表示它们是vue提供的特殊属性)
4.虚拟dom
vue2.0开始支持虚拟dom(提升页面加载速度,早期没有虚拟dom)