vue面试题
Vue面试题
1.vue中的MVVM模式
即Model-View-ViewModel。
Vue是以数据为驱动的，Vue自身将DOM和数据进行绑定，一旦创建绑定，DOM和数据将保持同步，每当数据发生变化，DOM会跟着变化。
ViewModel是Vue的核心，它是Vue的一个实例。Vue实例时作用域某个HTML元素上的，这个HTML元素可以是body，也可以是某个id所指代的元素。
DOM Listeners和Data Bindings是实现双向绑定的关键。DOM Listeners监听页面所有View 层DOM元素的变化，当发生变化，Model层的数据随之变化；Data Bindings监听Model层的数据，当数据发生变化，View层的DOM元素随之变化。
2.v-show指令，v-if的区别
条件渲染指令，与v-if不同的是，无论v-show的值为true或false，元素都会存在于HTML代码中；而只有当v-if的值为true，元素才会存在于HTML代码中。v-show指令只是设置了元素CSS的style值
3.如何让css只在当前组件中起作用
在每一个vue组件中都可以定义各自的css，js，如果希望组件内写的css只对当前组件起作用，只需要在style中写入scoped，即：
4.指令keep-alive
在vue-router写着keep-alive，keep-alive的含义：
如果把切换出去的组件保留在内存中，可以保留它的状态或避免重新渲染。为此可以添加一个keep-alive指令
5.Vuejs组件
vuejs构建组件使用
https://www.sodocs.net/doc/1b17159202.html,ponent('componentName',{ /*component*/ })；这里注意一点，组件要先注册再使用
https://www.sodocs.net/doc/1b17159202.html,ponent('mine',{
template:'#mineTpl',
props:['name','title','city','content']
});
var v=new Vue({
el:'#vueInstance',
data:{
name:'zhang',
title:'this is title',
city:'Beijing',
content:'these are some desc about Blog'
}
});
6.路由嵌套
路由嵌套会将其他组件渲染到该组件内，而不是进行整个页面跳转router-view本身就是将组件渲染到该位置，想要进行页面跳转，就要将页面渲染到根组件，在起始配置路由时
候写到：
var App = Vue.extend({ root });
router.start(App,'#app');
这里首先将根组件注册进来，用于将路由中配置好的各个页面渲染出来，然后将根组件挂载到与#app匹配的元素上。
7.指令v-el的使用
有时候我们想就像使用jquery那样去访问一个元素，此时就可以使用v-el指令，去给这个元素注册一个索引，方便通过所属实例的$el访问这个元素。
注意
HTML不区分大小写，所以v-el:someEl将转换为全小写。可以用v-el:some-el然后设置this.$el.someEl。
示例
hello
world
this.$els.msg.textContent // ->"hello"
this.$els.otherMsg.textContent // ->"world"
this.$els.msg //->hello
8.vuejs中使用事件名
在vuejs中，我们经常要绑定一些事件，有时候给DOM元素绑定，有时候给组件绑定。绑定事件在HTML中用v-on:click-"event",这时evet的名字不要出现大写，因为在1.x中不区分大小写，所以如果我们在HTML写v-on:click="myEvent"而在js中写myEvent就出错误，所以在vuejs的1.x绑定事件时候，要尽量避免使用大写字母。在2.0中没有该限制！
9.Vue.js是什么
Vue.js（是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。
Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件
10.VueJS 特性：
I: MVVM模式（数据变量（model）发生改变视图（view）也改变，视图（view）改变，数据变量（model）也发生改变）
使用MVVM模式有几大好处：
1. 低耦合。View可以独立于Model变化和修改，一个ViewModel可以绑定到不同的View上，当View变化的时候Model可以不变，当Model变化的时候View也可以不变。
2. 可重用性。可以把一些视图的逻辑放在ViewModel里面，让很多View重用这段视图逻辑。
3. 独立开发。开发人员可以专注与业务逻辑和数据的开发(ViewModel)。设计人员可以专注于界面(View)的设计。
4. 可测试性。可以针对ViewModel来对界面(View)进行测试
II: 组件化
III 指令系统
IIII: vue2.0开始支持虚拟dom
vue1.0是操作的是真的dom元素而不是虚拟的
虚拟dom:可以提升页面的刷新速度
虚拟DOM有利也有弊。
A：大小 - 其中之一就是更多的功能意味着代码包中更多行的代码。幸运的是，Vue.js 2.0 依旧比较小（当前版本 21.4kb），并
且也正在删除很多东西。
B: 内存 -同样，虚拟DOM需要将现有的DOM拷贝后保存在内存中，这是一个在DOM更新速度和内存使用中的权衡。
C: 并不适用所有情况 -如果虚拟DOM可以一次性进行批量的修改是非常好的。但是如果是单独的、稀少的更新呢？这样的任何
DOM更新都将会使虚拟DOM带来无意义的预计算
11.Vue.js特点
简洁：页面由HTML模板+Json数据+Vue实例组成
数据驱动：自动计算属性和追踪依赖的模板表达式
组件化：用可复用、解耦的组件来构造页面
轻量：代码量小，不依赖其他库
快速：精确有效批量DOM更新
模板友好：可通过npm，bower等多种方式安装，很容易融入
12.Vue.js 和 AngularJS 之间的区别是什么?
下面是一些选择 Vue 而不是 Angular 的可能原因；
Vue.js 是一个更加灵活开放的解决方案。它允许你以希望的方式组织你的应用程序，而不是任何时候都必须遵循 Angular 制定的规则。它仅仅是一个视图层，所以你可以将它嵌入一个现有页面而不一定要做成一个庞大的单页应用。在结合其他库方面它给了你更大的的空间，但相应，你也需要做更多的架构决策。例如，Vue.js 核心默认不包含路由和 ajax 功能，并且通常假定你在用应用中使用了一个外部的模块构建系统。这可能是最重要的区别在 API 和内部设计方面，Vue.js 比 Angular 简单得多, 因此你可以快速地掌握它的全部特性并投入开发。
Vue.js 拥有更好的性能，因为它不使用脏检查。当 watcher 越来越多时, Angular 会变得越来越慢，因为作用域内的每一次数据变更，所有的 watcher 都需要被重新求值。Vue 则根本没有这个问题，因为它采用的是基于依赖追踪的观察系统，所以所有的数据变更触发都是独立的，除非它们之间有明确的依赖关系。
Vue.js 中指令和组件的概念区分得更为清晰。指令只负责封装 DOM 操作，而组件代表一个自给自足的独立单元——它拥有自己的视图和数据逻辑。在 Angular 中它们两者间有不少概念上的混淆。
13.Vue.js 和 React.js 有什么区别?
React.js 和 Vue.js 确实有一些相似——它们都提供数据驱动、可组合搭建的视图组件。然而，它们的内部实现是完全不同的。React 是基于 Virtual DOM——一种在内存中描述DOM 树状态的数据结构。React 中的数据通常被看作是不可变的，而 DOM 操作则是通过Virtual DOM 的 diff 来计算的。与之相比，Vue.js 中的数据默认是可变的，而数据的变更会直接出发对应的 DOM 更新。相比于 Virtual DOM，Vue.js 使用实际的 DOM 作为模板，并且保持对真实节点的引用来进行数据绑定。
Virtual DOM 提供了一个函数式的描述视图的方法，这很 cool。因为它不使用数据观察机制，每次更新都会重新渲染整个应用，因此从定义上保证了视图通与数据的同步。它也开辟了 JavaScript 同构应用的可能性。
实话实说，我自己对 React 的设计理念也是十分欣赏的。但 React 有一个问题就是组件的逻辑和视图结合得非常紧密。对于部分开发者来说，他们可能觉得这是个优点，但对那些像我一样兼顾设计和开发的人来说，还是更偏好模板，因为模板能让我们更好地在视觉上思考设计和 CSS。JSX 和 JavaScript 逻辑的混合干扰了我将代码映射到设计的思维过程。相反，Vue.js 通过在模板中加入一个轻量级的 DSL (指令系统)，换来一个依旧直观的模板，且能够将逻辑封装进指令和过滤器中。
React 的另一个问题是：由于 DOM 更新完全交由 Virtual DOM 管理，当你真的想要自己控制 DOM 是就有点棘手了（虽然理论上你可以，但这样做时你本质上在对抗 React 的设计思想）。对于需要复杂时间控制的动画来说这就变成了一项很讨人厌的限制。在这方面，Vue.js 允许更多的灵活性，并且有不少用 Vue.js 构建的富交互实例
vue面试题及答案
2019 VUE前端面试题 1、 active-class 是哪个组件的属性？嵌套路由怎么定义？ 答：vue-router 模块的 router-link 组件。 2、怎么定义vue-router 的动态路由？怎么获取传过来的动态参数？ 答：在router目录下的index.js 文件中，对path属性加上/:id 。使用router对象的params.id 3、vue-router 有哪几种导航钩子？ 答：三种，一种是全局导航钩子：router.beforeEach(to,from, next) ，作用：跳转前进行判断拦截。第二种：组件内的钩子；第三种：单独路由独享组件 4、scss是什么？安装使用的步骤是？有哪几大特性？ 答：预处理css，把css当前函数编写，定义变量，嵌套。先装css-loader、node-loader sass-loader 等加载器模块，在 webpack-base.co nfig.js 配置文件中加多一个拓 展:extenstion ，再加多一个模块：module 里面 test、loader 4.1、scss是什么？在vue.cli中的安装使用步骤是？有哪几大特性？ 答：css的预编译。 使用步骤:
第一步：用 npm 下三个 loader(sass-loader 、css-loader、node-sass) 第二步：在 build 目录找到 webpack.base.config.js ，在那个extends 属性中加一个 拓展.scss 第三步：还是在同一个文件，配置一个module属性 第四步：然后在组件的style标签加上lang属性，例如：Iang= ” scss” 有哪几大特性： 1、可以用变量，例如($变量名称=值); 2、可以用混合器，例如() 3、可以嵌套 5、mint-ui是什么？怎么使用？说出至少三个组件使用方法？ 答：基于vue的前端组件库。npm 安装，然后import 样式和js， https://www.sodocs.net/doc/1b17159202.html,e(mintUi) 全局引入。在单个组件局部引入：import {Toast} from ‘ mint-ui '。组件一：Toast('登 录成 功’ );组件二: min t-header; 组件三： mi nt-swiper 6、v-model 是什么？怎么使用？vue 中标签怎么绑定事件？ 答 : 可以实现双向绑定，指令 (v-clas s 、v-for、v-if、v-show、v-on)。vue 的 model 层的 data 属性。绑定事件： 7、 axios是什么？怎么使用？描述使用它实现登录功能的流程？
前端最新面试题
这篇文章将分为三部分css和html为一部分，js、jQuery为一部分，vue与性能优化为一部分，今天会先整理css与html 1，弹性盒布局 父级设置display：flex将对象作为弹性伸缩盒显示 采用Flex布局的元素，被称为Flex容器(flex container)，简称“容器”。其所有子元素自动成为容器成员，成为Flex项目(Flex item)，简称“项目”。 容器默认生成两根主轴，水平方向主轴(main axis)和垂直方向交叉轴(cross axis)，默认项目按主轴排列。 设置在容器上的属性有6种 分别为 flex-direction：决定主轴的方向（即项目的排列方向） flex-wrap：定义换行情况 flex-flow：flex-direction和flex-wrap的简写，默认row nowrap justify-content：定义项目在主轴上的对齐方式。 align-item：定义在交叉轴上的对齐方式 align-content：定义多根轴线的对齐方式 详细属性值请参阅文档 2，html5新标签与新功能 新标签： header,footer,article,aside,nav,section,time,progress, ruby,mark.... 新功能： vidio，audio，canvas，拖放，离线应用，web存储（sessionStorage，localStorage，sessionStorage 方法针对一个session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除，localStorage 对象存储的数据没有时间限制。第二天、第二周或下一年之后，数据依然可用），历史状态管理，地理位置，新增input类型（color、date、datetime、datetime-local、email、month、number、range、search、tel、time、url、week），新增表单元素，WebSocket 3、css3的新特性 属性选择器：[attribute],[attribute=value],[attribute~=value]... 伪类选择器：:first-letter ，:first-line，:first-child.... 伪元素选择器：:before，:after border：border-image，border-radius,box-shadow 背景：background-size,background-origin,background-clip，background-image 渐变：线性渐变（Linear Gradients）径向渐变（Radial Gradients）
Vue面试题
1.css只在当前组件起作用 答：在style标签中写入scoped即可例如： 2.v-if 和v-show 区别 答：v-if按照条件是否渲染，v-show是display的block或none； 3.$route和$router的区别 答：$route是“路由信息对象”，包括path，params，hash，query，fullPath，matched，name等路由信息参数。而$router是“路由实例”对象包括了路由的跳转方法，钩子函数等。 4.vue.js的两个核心是什么？ 答：数据驱动、组件系统 5.vue几种常用的指令 答：v-for 、v-if 、v-bind、v-on、v-show、v-else 6.vue常用的修饰符？ 答：.prevent: 提交事件不再重载页面；.stop: 阻止单击事件冒泡；.self: 当事件发生在该元素本身而不是子元素的时候会触发；.capture: 事件侦听，事件发生的时候会调用 7.v-on 可以绑定多个方法吗？ 答：可以
8.vue中key 值的作用？ 答：当Vue.js 用v-for 正在更新已渲染过的元素列表时，它默认用“就地复用”策略。如果数据项的顺序被改变，Vue 将不会移动DOM 元素来匹配数据项的顺序，而是简单复用此处每个元素，并且确保它在特定索引下显示已被渲染过的每个元素。key的作用主要是为了高效的更新虚拟DOM。 9.什么是vue的计算属性？ 答：在模板中放入太多的逻辑会让模板过重且难以维护，在需要对数据进行复杂处理，且可能多次使用的情况下，尽量采取计算属性的方式。好处：①使得数据处理结构清晰；②依赖于数据，数据更新，处理结果自动更新；③计算属性内部this指向vm实例；④在template调用时，直接写计算属性名即可；⑤常用的是getter 方法，获取数据，也可以使用set方法改变数据；⑥相较于methods，不管依赖的数据变不变，methods都会重新计算，但是依赖数据不变的时候computed从缓存中获取，不会重新计算。 10.vue等单页面应用及其优缺点 答：优点：Vue 的目标是通过尽可能简单的API 实现响应的数据绑定和组合的视图组件，核心是一个响应的数据绑定系统。MVVM、数据驱动、组件化、轻量、简洁、高效、快速、模块友好。 缺点：不支持低版本的浏览器，最低只支持到IE9；不利于SEO的优化（如果要支持SEO，建议通过服务端来进行渲染组件）；第一次加载首页耗时相对长一些；不可以使用浏览器的导航按钮需要自行实现前进、后退。
中兴VUE FDD中级TDD高级面试题-20200225(1)
一、面试技巧 1、涉及工作年限问题，将自己工作年限在合理的基础上适当增加1年，一般中级3 年以上，高级5年以上； 2、涉及项目经历，在可能对应工作问到的问题都准备充足的情况下，将自己的工作经 历、岗位经历、项目经历说得丰富一些，例如：光做干扰工作的可以说说自己端到 端工作、性能分析工作，但增加这些经历同样要准备好相应工作模块的可能的问题； 3、做到回答问题逻辑清晰，流程清晰，对于无法准确回答的问题，可以回答相应的工 作思路，多采用归一法； 4、沟通尽量保持友善、客观，提升亲近分； 5、回答的问题中加入一般流程是如何解决的，结合现场是如何做的，若有特殊的情况， 也可指出； 二、中级VUE面试 1.干扰如何产生，怎么排查，怎么优化？ 2.RRC建立成功率低有哪些原因？ 3.谈谈你对网格优化的思路。 4.5G回4G一般回到4G的那个频段上？ 5.投诉的流程。 6.高优先级向低优先级重选流程 7.VO流程 8.QCI承载 9.主要负责的工作和工作中遇到的问题有哪些？ 10.现网切换重选的参数是怎么配置的？ 11.覆盖速率优化自以及室分对打方面的测量策略有哪些？ 12.所在项目类型，在项目负责那一块，投诉中出现单通怎么解决，后台参数调整具体 操作？ 13.容量参数有哪些？ 14.室分MR问题如何处理？ 15.低流量如何处理？ 16.低CQI如何处理？
17.单验下载速率低有哪些问题？ 18.子帧配比，特殊时隙配比是怎么样的？ 19.重叠覆盖如何解决？ 20.用户投诉不能打电话一般有哪些原因，如何处理？ 21.切换信令流程和TAU流程是怎样的？ 22.S1切换与X2切换的区别是什么？ 23.S准则，R准则是怎样的？ 24.日常关注哪些指标？ 25.有几个PCI？ 26.TM3,TM4区别 27.低速率原因与涉及到速率的后台参数 28.灌包的作用有哪些？ 29.随机接入的流程是怎样的？随机接入的场景有哪些？ 30.高负荷如何处理及现网配置； 31.TF组网配置； 32.SINR好，但速率低，会修改那些参数？ 33.邻区漏配信令中如何体现？ 34.前台测试速率低什么问题怎么优化？ 35.邻区漏配怎么看？ 36.TM传输模式有几种，怎么用，现网怎么用？ 37.A1到A5代表什么？ 38.fdd遇到速率较低时贵如何解决？ 39.触发负荷均衡的原因 40.干扰小区门限值和拥塞小区的门限值 41.全网子帧配比，特殊子帧配比配置5（3：9：2）和配置7（10：2：2）有什么区别 42.项目都做过什么 43.速率低怎么处理 44.A4和A5的区别 45.指标差怎么处理 46.干扰种类，怎么排查
前端面试中常见Vue知识点整理
看看面试题，只是为了查漏补缺，看看自己那些方面还不懂。切记不要以为背了面试题，就万事大吉了，最好是理解背后的原理，这样面试的时候才能侃侃而谈。 不然，稍微有水平的面试官一看就能看出，是否有真才实学还是刚好背中了这道面试题。 一、对于MVVM的理解？ MVVM 是Model-View-ViewModel 的缩写。 ?Model代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑。 ?View代表UI 组件，它负责将数据模型转化成UI 展现出来。 ?ViewModel监听模型数据的改变和控制视图行为、处理用户交互，简单理解就是一个同步View 和Model的对象，连接Model和View。 在MVVM架构下，View 和Model 之间并没有直接的联系，而是通过ViewModel 进行交互，Model 和ViewModel 之间的交互是双向的，因此View 数据的变化会同步到Model中，而Model 数据的变化也会立即反应到View 上。 ViewModel通过双向数据绑定把View 层和Model 层连接了起来，而View 和Model 之间的同步工作完全是自动的，无需人为干涉，因此开发者只需关注业务逻辑，不需要手动操作DOM，不需要关注数据状态的同步问题，复杂的数据状态维护完全由MVVM 来统一管理。 二、Vue的生命周期 beforeCreate（创建前），在数据观测和初始化事件还未开始 created（创建后），完成数据观测，属性和方法的运算，初始化事件，$el 属性还没有显示出来 beforeMount（载入前），在挂载开始之前被调用，相关的render函数首次被调用。实例已完成以下的配置：编译模板，把data里面的数据和模板生成html。 注意此时还没有挂载html到页面上。 mounted（载入后），在el 被新创建的vm.$el 替换，并挂载到实例上去之后调用。实例已完成以下的配置：用上面编译好的html内容替换el属性指向的DOM 对象。完成模板中的html渲染到html页面中。此过程中进行ajax交互。 beforeUpdate（更新前），在数据更新之前调用，发生在虚拟DOM重新渲染和打补丁之前。可以在该钩子中进一步地更改状态，不会触发附加的重渲染过程。
vue面试题
Vue面试题 1.vue中的MVVM模式 即Model-View-ViewModel。 Vue是以数据为驱动的，Vue自身将DOM和数据进行绑定，一旦创建绑定，DOM和数据将保持同步，每当数据发生变化，DOM会跟着变化。 ViewModel是Vue的核心，它是Vue的一个实例。Vue实例时作用域某个HTML元素上的，这个HTML元素可以是body，也可以是某个id所指代的元素。 DOM Listeners和Data Bindings是实现双向绑定的关键。DOM Listeners监听页面所有View 层DOM元素的变化，当发生变化，Model层的数据随之变化；Data Bindings监听Model层的数据，当数据发生变化，View层的DOM元素随之变化。 2.v-show指令，v-if的区别 条件渲染指令，与v-if不同的是，无论v-show的值为true或false，元素都会存在于HTML代码中；而只有当v-if的值为true，元素才会存在于HTML代码中。v-show指令只是设置了元素CSS的style值 3.如何让css只在当前组件中起作用 在每一个vue组件中都可以定义各自的css，js，如果希望组件内写的css只对当前组件起作用，只需要在style中写入scoped，即： 4.指令keep-alive 在vue-router写着keep-alive，keep-alive的含义： 如果把切换出去的组件保留在内存中，可以保留它的状态或避免重新渲染。为此可以添加一个keep-alive指令
XX区域VUE中级认证面试题-ZTE
VUE中级面试题 1、PCI定义及规划原则 PCI=3*PSS(主同步)+SSS（辅同步） 在满足PCI分配策略的前提下，PCI在规划过程中采用下面的原则：共有504个物理标识，被分为168组，每组3个标识。每组中的3个标识通常分配给同一eNodeB控制下的小区。数量上的限制导致相同的PCI需要在不同小区复用。 1、不能出现PCI冲突及混淆(对主小区有强干扰的其它同频小区，不能使用与主小区相同的PCI（异频小区的邻区可以使用相同的PCI）电平，但对UE的接收仍然产生干扰，因此这些小区是否能采用和主小区相同的PCI（同PCI复用）) 2、邻区以及邻区的邻区不能出现相同PCI(邻小区导频符号V-shift错开最优化原则；（LTE导频符号在频域的位置与该小区分配的PCI码相关，通过将邻小区的导频率符号频域位置尽可能地错开，可以一定程度降低导频符号相互之间的干扰，进而对网络整体性能有所提升（验证结果表明，在50%小区负载下，通过错开邻区导频符号位置，导频SINR有大约3dB左右的提升）。 3、相同PCI复用距离尽可能的远，如果在复用距离内，由于某种原因导致出现相同的PCI，在此情况下，则查找使用过的PCI集合中距离最远的且满足相关性的PCI进行分配 4、如果基站有超过3个小区的情况，按照如下方式处理：将该基站虚拟地分成多个基站，其中每个基站包含不超过三个小区，然后对这几个基站进行PCI分配。 基于实现简单，清晰明了，容易扩展的目标，目前采用的规划原则：同一站点的PCI分配在同一个PCI组内，相邻站点的PCI在不同的PCI组内。 对于存在室内覆盖场景时，规划时需要考虑是否分开规划。 PCI共有504个，PCI规划主要需尽量避免PCI模三干扰； 2、9种传输模式 1. TM1，单天线端口传输：主要应用于单天线传输的场合 2. TM2，开环发射分集：不需要反馈PMI，适合于小区边缘信道情况比较复杂，干扰较大的情况，有时候也用于高速的情况，分集能够提供分集增益 3. TM3，开环空间复用：不需要反馈PMI，合适于终端（UE）高速移动的情况 4. TM4，闭环空间复用：需要反馈PMI，适合于信道条件较好的场合，用于提供高的数据率传输 5. TM5，MU-MIMO传输模式（下行多用户MIMO）：主要用来提高小区的容量 6. TM6，闭环发射分集，闭环Rank1预编码的传输：需要反馈PMI，主要适合于小区边缘的情况 7. TM7，Port5的单流Beamforming模式：主要也是小区边缘，能够有效对抗干扰 8. TM8，双流Beamforming模式：可以用于小区边缘也可以应用于其他场景 9. TM9, 传输模式9是LTE-A中新增加的一种模式，可以支持最大到8层的传输，主要为了提升数据传输速率
vue面试题及答案
2019 VUE前端面试题 1、active-class是哪个组件的属性?嵌套路由怎么定义? 答：vue-router模块的router-link组件。 2、怎么定义vue-router的动态路由?怎么获取传过来的动态参数? 答：在router目录下的index.js文件中，对path属性加上/:id。使用router对象的params.id 3、vue-router有哪几种导航钩子? 答：三种，一种是全局导航钩子：router.beforeEach(to,from,next)，作用：跳转前进行判断拦截。第二种：组件内的钩子;第三种：单独路由独享组件 4、scss是什么?安装使用的步骤是?有哪几大特性? 答：预处理css，把css当前函数编写，定义变量,嵌套。先装css-loader、node-loader、sass-loader等加载器模块，在webpack-base.config.js配置文件中加多一个拓 展:extenstion，再加多一个模块：module里面test、loader 4.1、scss是什么?在vue.cli中的安装使用步骤是?有哪几大特性? 答：css的预编译。 使用步骤：
第一步：用npm 下三个loader(sass-loader、css-loader、node-sass) 第二步：在build目录找到webpack.base.config.js，在那个extends属性中加一个拓展.scss 第三步：还是在同一个文件，配置一个module属性 第四步：然后在组件的style标签加上lang属性，例如：lang=”scss” 有哪几大特性: 1、可以用变量，例如($变量名称=值); 2、可以用混合器，例如() 3、可以嵌套 5、mint-ui是什么?怎么使用?说出至少三个组件使用方法? 答：基于vue的前端组件库。npm安装，然后import样式和js，https://www.sodocs.net/doc/1b17159202.html,e(mintUi)全局引入。在单个组件局部引入：import {Toast} from ‘mint-ui’。组件一：Toast(‘登录成功’);组件二：mint-header;组件三：mint-swiper 6、v-model是什么?怎么使用? vue中标签怎么绑定事件? 答：可以实现双向绑定，指令(v-class、v-for、v-if、v-show、v-on)。vue的model 层的data属性。绑定事件：
(完整版)前端面试题及答案2019
--------------------------------------面试题----------------------------------------- 1 vuex的五个状态 VueX 是一个专门为Vue.js 应用设计的状态管理架构，统一管理和维护各个vue组件的可变化状态(你可以理解成vue 组件里的某些data )。 Vue有五个核心概念，state, getters, mutations, actions, modules。 state => 基本数据==data getters => 从基本数据派生的数据==computed mutations => 提交更改数据的方法，同步！==methods actions => 像一个装饰器，包裹mutations，使之可以异步。 modules => 模块化Vuex 2 vue周期(钩子函数) created可获取数据Mounted可操作DOM Vue实例有一个完整的生命周期，也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、销毁等一系列过程，我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程，就是生命周期。 分为三个阶段：初始化、运行中、销毁。 beforeCreate：实例、组件通过new Vue() 创建出来之后会初始化事件和生命周期，然后就会执行beforeCreate钩子函数，这个时候，数据还没有挂载呢，只是一个空壳，无法访问到数据和真实的dom，一般不做操作 Created：挂载数据，绑定事件等等，然后执行created函数，这个时候已经可以使用到数据，也可以更改数据,在这里更改数据不会触发updated函数，在这里可以在渲染前倒数第二次更改数据的机会，不会触发其他的钩子函数，一般可以在这里做初始数据的获取 beforeMount：接下来开始找实例或者组件对应的模板，编译模板为虚拟dom放入到render函数中准备渲染，然后执行beforeMount钩子函数，在这个函数中虚拟dom已经创建完成，马上就要渲染,在这里也可以更改数据，不会触发updated，在这里可以在渲染前最后一次更改数据的机会，不会触发其他的钩子函数，一般可以在这里做初始数据的获取 Mounted：接下来开始render，渲染出真实dom，然后执行mounted钩子函数，此时，组件已经出现在页面中，数据、真实dom都已经处理好了,事件都已经挂载好了，可以在这里操作真实dom 等事情... beforeUpdate：当组件或实例的数据更改之后，会立即执行beforeUpdate，然后vue的虚拟dom 机制会重新构建虚拟dom与上一次的虚拟dom树利用diff算法进行对比之后重新渲染，一般不做什么事儿 Updated：当更新完成后，执行updated，数据已经更改完成，dom也重新render完成，可以操作更新后的虚拟dom beforeDestroy：当经过某种途径调用$destroy方法后，立即执行beforeDestroy，一般在这里做一些善后工作，例如清除计时器、清除非指令绑定的事件等等 Destroyed：组件的数据绑定、监听...去掉后只剩下dom空壳，这个时候，执行destroyed，在这里做善后工作也可以 钩子函数的的实际应用 beforecreate : 举个栗子：可以在这加个loading事件 created：在这结束loading，还做一些初始化，实现函数自执行 mounted ：在这发起后端请求，拿回数据，配合路由钩子做一些事情 beforeDestroy：你确认删除XX吗？destroyed ：当前组件已被删除，清空相关内容
前端笔试题
一、单选题 1. 设置元素浮动后，该元素的display 值是( ) A.block B. 不变 C. inline D. inline-block 2. 对权重排序正确的是( ) a) .list .box p b) #list .box div span c) .list span d) #list #box e) p:last-child f) style A.f>d>b>a>c>e C. f>d>b>a>c=e B. f>d>b>a>e>c D. f>b>d>a>c=e 3.对document load 和document ready 描述正确的是( ) A.$(document).ready()是当页?所有资源全部加载完成后，执??个函数 B.如果图?资源较多加载时间较长，onload 后等待执?的函数需要等待较长时间，所以?些效果可能受到影响 C.onload 是当DOM ?档树加载完成后执??个函数 D.?般来说load 会比$(document).ready()较快执? 4.["1", "2", "3"].map(parseInt) 答案是多少( ) A.[1, NaN, NaN] B. [1, 2, NaN] C.[NaN, NaN, NaN] D. [1, NaN] 5.var temp=null，alert(typeof temp)弹出的结果是( ) A.Null B. Object C. Undefined D. String 二、多选题 1. 以下哪些是javascript 的全局函数() A.parseFloat B. eval C. setTimeout D. alert 2. 对http 相关内容描述正确的是()
Vue题库(可编辑修改word版)
Vue 题库 1、active-class 是哪个组件的属性？嵌套路由怎么定义？ 答：vue-router 模块的router-link 组件。 2、怎么定义vue-router 的动态路由？怎么获取传过来的动态参数？ 答：在router 目录下的index.js 文件中，对path 属性加上/:id。使用router 对象的params.id 3、vue-router 有哪几种导航钩子？ 答：三种，一种是全局导航钩子：router.beforeEach(to,from,next)，作用：跳转前进行判断拦截。第二种：组件内的钩子；第三种：单独路由独享组件 4、scss 是什么？安装使用的步骤是？有哪几大特性？ 答：预处理css，把css 当前函数编写，定义变量,嵌套。先装css-loader、node- loader、sass-loader 等加载器模块，在webpack-base.config.js 配置文件中加多一个拓展:extenstion，再加多一个模块：module 里面test、loader 4.1、scss 是什么？在vue.cli 中的安装使用步骤是？有哪几大特性？ 答：css 的预编译。 使用步骤： 第一步：用npm 下三个loader（sass-loader、css-loader、node-sass） 第二步：在build 目录找到webpack.base.config.js，在那个extends 属性中加一个拓展.scss 第三步：还是在同一个文件，配置一个module 属性 第四步：然后在组件的style 标签加上lang 属性，例如：lang=”scss” 有哪几大特性: 1、可以用变量，例如（$变量名称=值）； 2、可以用混合器，例如（）
vue面试笔试题
Vue常见面试题 1：vue.js的两个核心是什么？ 答:数据驱动和组件化。 2：vue生命周期钩子函数有哪些？ 答:总共分为8个阶段创建前/后，载入前/后，更新前/后，销毁前/后 3：第一次页面加载会触发哪几个钩子？ 答：会触发下面这几个beforeCreate, created, beforeMount, mounted 。 4：详细介绍每个生命周期钩子函数 创建前/后：在beforeCreated阶段，vue实例的挂载元素$el和数据对象data都为undefined，还未初始化。在created阶段，vue实例的数据对象data有了，$el还没有。 载入前/后：在beforeMount阶段，vue实例的$el和data都初始化了，但还是挂载之前为虚拟的dom节点，data.message还未替换。在mounted阶段，vue实例挂载完成，data.message 成功渲染。 更新前/后：当data变化时，会触发beforeUpdate和updated方法。 销毁前/后：在执行destroy方法后，对data的改变不会再触发周期函数，说明此时vue实例已经解除了事件监听以及和dom的绑定，但是dom结构依然存在 5：请问v-if和v-show有什么区别？ 答：不同点： a.实现方式：v-if是根据后面数据的真假值判断直接从Dom树上删除或重建元素节点。v-show只是在修改元素的css样式，也就是display的属性值，元素始终在Dom树上。 b.编译过程：v-if切换有一个局部编译/卸载的过程，切换过程中合适地销毁和重建内部的事件监听和子组件；v-show只是简单的基于css切换； c.编译条件：v-if是惰性的，如果初始条件为假，则什么也不做；只有在条件第一次变为真时才开始局部编译；v-show是在任何条件下（首次条件是否为真）都被编译，然后被缓存，而且DOM元素始终被保留； d.性能消耗：v-if有更高的切换消耗，不适合做频繁的切换；v-show有更高的初始渲染消耗，适合做频繁的额切换； 6：vue中key值的作用
《Vue-框架开发》期末考试试题
《Vue-框架开发》期末考试试题 1. .Vue与 Angular和 React框架不同的是，Vue设计为自下而上逐层应用。 [判断题] * 对(正确答案) 错 2. Vue完全能够为复杂的单页应用提供驱动。 [判断题] * 对(正确答案) 错 3. Vue是一套构建用户界面的渐进式框架，Vue的核心只关注视图层。 [判断题] *对 错(正确答案) 4. Vue中MVVM框架主要由3部分组成: Model、View和 ViewModel [判断题] * 对(正确答案) 错 5. Vue可以在Node环境下进行开发，并借助npm包管理器来安装依赖。 [判断题] * 对(正确答案) 错 6. 在项目中引入了 vuejs文件，才可以创建Vue实例。 [判断题] * 对(正确答案) 错
7. Vue事件传递方式有冒泡和捕获，默认是冒泡。 [判断题] * 对(正确答案) 错 8. Vue开发提出了组件化开发思想，每个组件都是一个独立的单元。 [判断题] * 对(正确答案) 错 9. 在Vue中 beforeDestroy与 destroyed钩子函数执行后，都可以获取到Vue实例。[判断题] * 对(正确答案) 错 10. Vue提供的全局APl接口 component,不能用来注册组件。 [判断题] * 对 错(正确答案) 11. Vue实例对象中data数据具有响应特性 [判断题] * 对(正确答案) 错 12. Vue中通过wm.slots可以获取子组件实例对象 [判断题] * 对 错(正确答案) 13. Vue实例对象中通过 options可以获取到父作用域下的所有属性。 [判断题] * 对(正确答案) 错
2020年web前端最全面试题及答案【含vue-react】
目录 HTML篇 (1) 1,doctype的作用是什么 (1) 文档解析类型有： (1) 2, 这三种模式的区别是什么 (1) 3, HTML、XHTML、XML有什么区别 (2) 4, 什么是data-属性 (2) 5, 你对HTML语义化的理解 (2) 6, HTML5与HTML4的不同之处 (3) 7有哪些常用的meta标签 (4) 8, src和href的区别 (4) 9知道img的srcset的作用是什么 (5) 10, 还有哪一个标签能起到跟srcset相似作用 (5) 11, script标签中defer和async的区别 (5) 12, 有几种前端储存的方式 (6) 13, 这些方式的区别是什么 (6) CSS篇 (7) 1, CSS选择器的优先级是怎样的 (7) 2,link和@import的区别 (7) 2,em\px\rem区别 (8) 3,块级元素水平居中的方法 (8) 4, CSS有几种定位方式 (8) 5, 如何理解z-index (9) 6, 如何理解层叠上下文 (9) 是什么 (9) 如何产生 (9) 7, 清除浮动有哪些方法 (10) 8,你对css sprites的理解，好处是什么 (10) 是什么 (10)
好处： (11) 不足： (11) 9, 你对媒体查询的理解 (11) 是什么 (11) 如何使用 (12) 10, 你对盒模型的理解 (12) 是什么 (12) 11, 标准盒模型和怪异盒模型有什么区别 (12) 12, 谈谈对BFC的理解 (13) 是什么 (13) 如何形成 (13) 作用是什么 (14) 13, 为什么有时候人们用translate来改变位置而不是定位 (14) 14, 伪类和伪元素的区别是什么 (14) 是什么 (15) 区别 (15) 15, 你对flex的理解 (15) JS篇 (16) 1, 解释下变量提升 (16) 2, 理解闭包吗 (16) 闭包是什么 (16) 3, JavaScript的作用域链理解吗 (16) 4, ES6模块与CommonJS模块有什么区别 (17) ES6 Module和CommonJS模块的区别： (17) ES6 Module和CommonJS模块的共同点： (17) 5,js有哪些类型 (17) 原始类型: (18) 复杂类型: (18) 6, null与undefined的区别是什么 (18) 7, 谈谈你对原型链的理解 (18) 原型对象 (19)
2019前端经典面试题
1，html和xml有什么区别 html是超文本标记语言xml是可扩展标记语言 html语法宽松，xml语法严谨 html使用固有标记，xml没有固有标记 html标签预定义，xml标签可扩展，可定义 html是用来显示数据的，xml是用来描述和存储数据的 2，css有哪几种选择器？权重的优先级？ 第一种为属性选择器 第二种为id选择器 第三种为class选择器 第四种为伪类选择器 第五种是后代选择器 第六种是标签选择器 第七种是通用选择器 第八种是伪元素选择器 1. 第一等：代表内联样式，如: style=””，权值为1000。 2. 第二等：代表ID选择器，如：#content，权值为0100。 3. 第三等：代表类，伪类和属性选择器，如.content，权值为0010。 4. 第四等：代表类型选择器和伪元素选择器，如div p，权值为0001。 5. 通配符、子选择器、相邻选择器等的。如*、>、+,权值为0000。 6. 继承的样式没有权值。 3，网页有哪几部分组成？ 结构层：html 表示层：css 行为层：js和dom 4，一个200*200的div在不同分辨率屏幕上下左右居中，用css实现 Div{ position:absolute; width:200px; height:200px; top:50%; left:50%; margin-top:-100px; margin-left:-100px; }
5，阐述清楚浮动的几种方式 第一种父级div定义高度height 适合高度固定的布局 第二种父级div定义overflow：hidden 第三种结尾处加空标签clear：both 让父级自动获取高度 第四种父级div定义伪类:after 和zoom 6，解释css sprites，如何使用？ CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background- repeat”，“background-position”的组合进行背景定位，background-position可以用数字能精确的定位出背景图片的位置。 CSS Sprites为一些大型的网站节约了带宽，让提高了用户的加载速度和用户体验，不需要加载更多的图片 7，如何用原生js给一个按钮绑定两个onclick事件？ Var btn1 =document. getElementsById(“btn”); btn1.addEnventListener(“click”,”hello1); btn1.addEnventListener(“click”,”hello2); function hello1(){ alert(“hello1”); } function hello2(){ alert(“hello2”); } 8, 拖曳会用到哪些事件？ Dragstart Dragenter Dragover Dragleave Drag Drop Dragend 9, 请列举jQuery中选择器？ 1，基本选择器 ID，class，元素之类的 2，层级选择器 返回的是jQuery对象才可以进行的链式操作
vue面试题_vue常见面试题和答案
vue常见面试题和答案 1.vue优点？ 答：轻量级框架：只关注视图层，是一个构建数据的视图集合，大小只有几十kb； 简单易学：国人开发，中文文档，不存在语言障碍，易于理解和学习； 双向数据绑定：保留了angular的特点，在数据操作方面更为简单； 组件化：保留了react的优点，实现了html的封装和重用，在构建单页面应用方面有着独特的优势； 视图，数据，结构分离：使数据的更改更为简单，不需要进行逻辑代码的修改，只需要操作数据就能完成相关操作； 虚拟DOM：dom操作是非常耗费性能的，不再使用原生的dom操作节点，极大解放dom操作，但具体操作的还是dom不过是换了另一种方式； 运行速度更快:相比较与react而言，同样是操作虚拟dom，就性能而言，vue 存在很大的优势。 2.vue父组件向子组件传递数据？ 答：通过props 3.子组件像父组件传递事件？ 答：$emit方法 4.v-show和v-if指令的共同点和不同点？ 答: 共同点：都能控制元素的显示和隐藏； 不同点：实现本质方法不同，v-show本质就是通过控制css中的display设置为none，控制隐藏，只会编译一次；v-if是动态的向DOM树内添加或者删除
DOM元素，若初始值为false，就不会编译了。而且v-if不停的销毁和创建比较消耗性能。 总结：如果要频繁切换某节点，使用v-show(切换开销比较小，初始开销较大)。如果不需要频繁切换某节点使用v-if（初始渲染开销较小，切换开销比较大）。 5.如何让CSS只在当前组件中起作用？ 答：在组件中的style前面加上scoped 6.
Vue题库
Vue题库 1、active-class是哪个组件的属性？嵌套路由怎么定义？ 答：vue-router模块的router-link组件。 2、怎么定义vue-router的动态路由？怎么获取传过来的动态参数？ 答：在router目录下的index.js文件中，对path属性加上/:id。使用router对象的params.id 3、vue-router有哪几种导航钩子？ 答：三种，一种是全局导航钩子：router.beforeEach(to,from,next)，作用：跳转前进行判断拦截。第二种：组件内的钩子；第三种：单独路由独享组件 4、scss是什么？安装使用的步骤是？有哪几大特性？ 答：预处理css，把css当前函数编写，定义变量,嵌套。先装css-loader、node-loader、sass-loader等加载器模块，在webpack-base.config.js配置文件中加多一个拓展:extenstion，再加多一个模块：module里面test、loader 4.1、scss是什么？在vue.cli中的安装使用步骤是？有哪几大特性？ 答：css的预编译。 使用步骤： 第一步：用npm下三个loader（sass-loader、css-loader、node-sass） 第二步：在build目录找到webpack.base.config.js，在那个extends属性中加一个拓展.scss 第三步：还是在同一个文件，配置一个module属性 第四步：然后在组件的style标签加上lang属性，例如：lang=”scss” 有哪几大特性: 1、可以用变量，例如（$变量名称=值）； 2、可以用混合器，例如（）
Vue面试题(供参考)
1、active-class是哪个组件的属性？嵌套路由怎么定义？ 答：vue-router模块的router-link组件。 2、怎么定义vue-router的动态路由？怎么获取传过来的动态参数？ 答：在router目录下的index.js文件中，对path属性加上/:id。使用router 对象的params.id 3、vue-router有哪几种导航钩子？ 答：三种，一种是全局导航钩子：router.beforeEach(to,from,next)，作用：跳转前进行判断拦截。第二种：组件内的钩子；第三种：单独路由独享组件 4、scss是什么？安装使用的步骤是？有哪几大特性？ 答：预处理css，把css当前函数编写，定义变量,嵌套。先装css-loader、node-loader、sass-loader等加载器模块，在webpack-base.config.js配置文件中加多一个拓展:extenstion，再加多一个模块：module里面test、loader 4.1、scss是什么？在vue.cli中的安装使用步骤是？有哪几大特性？ 答：css的预编译。 使用步骤： 第一步：用npm 下三个loader（sass-loader、css-loader、node-sass） 第二步：在build目录找到webpack.base.config.js，在那个extends属性中加一个拓展.scss 第三步：还是在同一个文件，配置一个module属性 第四步：然后在组件的style标签加上lang属性，例如：lang=”scss” 有哪几大特性: 1、可以用变量，例如（$变量名称=值）； 2、可以用混合器，例如（） 3、可以嵌套