vue简介

Posted itzhangyunpeng

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue简介相关的知识,希望对你有一定的参考价值。

1、vue是什么?

是一个渐进式框架

自底向上增量开发的设计

易学习(没看出来)

易整合(暂时也没发现)

vue的核心只关注视图层,并且容易学习,非常容易与其他库或已有的项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用。

2、vue适合做哪种类型的界面?

a、表单项繁多

b、内容需要根据用户的操作进行修改的。

vue就是一个用于搭建类似于网页版知乎这种表单项繁多,且内容需要根据用户的操作进行修改的网页版应用。

3、单页面应用程序(SPA)是什么?

一个页面就是一个应用(子应用)

顾名思义,单页应用一般指的就是一个页面的就是应用,当然也可以是一个子应用,比如知乎的一个页面就可以看做是一个子应用。单页面应用程序中一般的交互处理非常多,而且页面中的内容需要根据用户的操作动态变化。

4、前面说的网页版知乎我也可以使用jquerty学,为啥要用vue?

a、产品觉得需要反复修改的

b、修改可能导致dom的关联与嵌套层次要发生改变从而是jquery结构相关代码变的异常复杂

c、vue可以解决这个问题

你是否还记得当初写jquery时候,有写过

(‘#xxx‘).parent().parent().parent()这种代码呢?当你第一次写的时候,你觉得页面元素不多,不就是找这个元素的爸爸的爸爸的爸爸吗,我大不了在注释里面写清楚这个元素的爸爸的爸爸的爸爸不就好了。但是万一过几天之后你的项目组长或者你的产品经理突然对你做的网页提出修改要求,这个修改要求将会影响页面的结构,也就是DOM的关联与嵌套层次要发生改变,那么(‘#xxx’).parent().parent().parent()可能就会变成$(‘#xxx’).parent().parent().parent().parent().parent()了。

这还不算什么,等以后产品迭代越来越快,修改越来越多,而且页面中类似的关联和嵌套DOM元素不止一个,那么修改起来将非常费劲。而且JQuery选择器查找页面元素以及DOM操作本身也是有性能损失的,可能到时候打开这个页面,会变得越来越卡,而你却无从下手。

这个时候如果你学过Vue.js,那么这些抱怨将不复存在。

5、前面里面常说的视图层是什么?

我们把html中的dom就可以与其他的部分独立开来划分出一个层次,这个层次就叫做视图层。

vue的核心只关注视图层

6、使用jquery开发完成页面的流程?

a、html写框架

b、css装饰

c、js交互

讲到jquery,就不得不说到javascript的dom操作了,如果你用jQuery来开发一个知乎,那么你就需要使用jquery中各种dom操作方法去操作HTML的dom结果了。

现在我们把一个网页应用抽象一下,那么HTML中的dom起始就是视图,一个网页就是通过don的组合与嵌套,形成了最基本的视图结构,再通过css的修饰,在基本的视图结构上“化妆“让他们看起来更加美观,最后设计到交互的部分,就需要使用javascript来接受用户的交互请求,并且通过时间机制来响应用户的交互操作,并且在事件处理函数中进行各种数据的修改,比如说修改某个dom中innerHTML或者innerText部分。

7、vue为啥能让基于网页的前端应用程序开发起来这么方便?

a、有声明式

b、响应式的数据绑定

c、组件化的开发

d、virtual dom

因为vue有声明式、响应式的数据绑定与组件化的开发并且还是用了virtual dom这个看名字就觉得高大上的技术。

8、vue中常说的数据动态绑定是啥?

就是vue会自动响应数据的变化情况,并且根据用户在代码中预先写好的绑定关系,对所有绑定在一起的数据和视图内容都进行修改。而这种绑定关系,在图上是以input标签的v-model属性来声明的,因此你在别的地方可能也会看到有人粗略的称vue为声明式渲染的模板引擎。

9、前端中为啥要组件化开发?

a、非组件化开发代码和工作量都非常大

b、修改起来麻烦

但是现在我们做单页应用,页面交互和结构十分复杂,一个页面上就有许许多多的模块需要编写,而且往往一个模块的代码量和工作量就非常庞大,如果还按照原先的方法来开发,那么会累死人。而且遇到以后的产品需求变更,修改起来也非常麻烦,生怕动了其中一个div之后,其他div跟着雪崩,整个页面全部乱套,或者由于JavaScript的事件冒泡机制,导致修改一些内层的DOM事件处理函数之后,出现各种莫名其妙的诡异BUG。

10、前端中如何进行组件化开发?

a、借用后端面向对象中的模块化思想(把一个大功能拆分成许多函数,然后分配给不同的人来开发)

b、把一个单页应用中的各种模块拆分到一个一个单独的组件中,我们只要先在父级应用中写好各种组件标签,并且在组件标签中写好要传入组件的参数(就像给函数传入参数一样,这个参数叫做组件的属性),然后再分别写好各种组件的实现

在面向对象编程中,我们可以使用面向对象的思想将各种模块打包成类或者把一个大的业务模块拆分成更多更小的几个类。在面向过程中,我们也可以把一些大功能拆分成许多函数,然后分配给不同的人来开发

在前端应用,我们是否也可以像编程一样把模块封装?这就引用了组件化开发的思想。

vue通过组件,把一个单页面中的各个模块拆分到一个一个单独的组件中,我们只要现在父级应用中写好各种标签,并且在组件标签中写好要传入组件的参数(就像给函数传参数一样,这个参数叫做组件的属性),然后再分别写好各种组件的实现,然后整个应用就算做完了。

11、到底该如何使用vue做得那页面应用开发?

其实可以直接看学习视频开始干,应该是最好的

a、介绍 - vue.js官方文档的基础部分硬着头皮看一遍

我的建议是,先把介绍 - vue.js官方文档的基础部分硬着头皮看一遍。除了组件这个小节涉及到了很多晦涩难懂的名词以外,前面几章完全就是把Vue.js当作一个模版引擎来用。

b、ECMAScript6,Webpack,NPM以及Vue-Cli的基本用法,最好对Node.js也要有所了解

然后开始学习ECMAScript6,Webpack,NPM以及Vue-Cli的基本用法,最好对Node.js也要有所了解。

c、看网上各种实战视频以及文章还有别人开源的源代码

最后组件部分先大致看一遍,了解组件里面都有哪些概念之后,开始看网上各种实战视频以及文章还有别人开源的源代码。

 

 

未完待续。。。。。。

 

以上是关于vue简介的主要内容,如果未能解决你的问题,请参考以下文章

Vue简介及基本指令

Vue简介及基本指令

01-vue简介及起步

01-vue简介及起步

Vue核心 Vue简介 初识

Vue.js简介