Vue篇

21.Vue的路由钩子函数/路由守卫有哪些

全局守卫：beforeEach（to，from，next）和afterEach（to，from）

路由独享守卫：beforeEnter

组件内的守卫：路由进入/更新/离开之前

beforeRouterEnter/update/leave

22.Vue中如何进行动态路由设置？有哪些方式？怎么获取传递过来的数据？

动态路由也可以叫路由传参，动态路由有query和prrams两种方式传参

query用path引入，params用name引入，query用this.$route.query.name接收参数

params用this.$route.params.name接收参数

23.Elementui中的常用组件有哪些？请简述你经常使用的并且他们的属性有哪些？

Container布局容器

<el-container>外层容器

<el-header>顶栏容器

<el-aside>侧边栏容器

<el-main>主要内容容器

<el-footer>底栏容器

Dropdown下拉菜单

<el-containersplit-buton>下拉按钮

<el-container-menu>下拉菜单

<el-container-item>下拉项

Table表格

Tabs标签页

Form表单

Pagination分页

Message消息提示

24.Vue中指令有哪些

v-for：循环数组，对象，字符串，数字

v-on：绑定事件监听

v-bind：动态绑定一个或者多个属性

v-model：表单控件或者组件上创建双向绑定

v-ifv-elsev-else-if条件渲染

v-show根据表达式真假，切换元素的display

v-html更新元素的innerhtml

v-text更新元素的textcontent

v-pre跳过这个元素和子元素的编译过程

v-clock这个指令保持在元素上知道关联实例结束编译

v-once只渲染一次

25.Vue如何定义一个过滤器

过滤器本质就是一个有参数有返回值的方法

newVue({filters:{myCurrency:function(myInput){return处理后的数据}}})

使用方法：<h1>{{表达式|过滤器}}</h1>

过滤器高级用法：可以指定参数，告诉过滤器按照参数进行数据的过滤

26.对vue中keep-alive的理解

概念：keep-alive是vue的内置组件，当它动态包裹组件时，会缓存不活动的组件实例，它自身不会渲染成一个DOM元素也不会出现在父组件链中

作用：在组件切换过程中将状态保留在内存中，防止重复渲染DOM，减

少加载时间以及性能消耗，提高用户体验。生命周期函数：Activated在keep-alive组件激活时调用，deactivated

在keep-alive组件停用时调用

27.如何让组件中的css在当前组件生效

在styled中加上scoped

28.Vue生命周期一共几个阶段

创建加载更新销毁

Beforecreate创建前

Created创建后

Beforemount加载前

Mounted加载后

Beforeupdate更新前

Updated更新后

Beforedestroy销毁前

Destroyed销毁后

页面第一次加载会触发

beforecreatecreatedbeforemountmounted

DOM渲染在mounted周期中就已经完成

29.Mvvm与mvc的区别

Mvc模型视图控制器，视图是可以直接访问模型，所以，视图里面会包

含模型信息，mvc关注的是模型不变，所以，在mvc中，模型不依赖视

图，但是视图依赖模型

Mvvm模型视图和vmvm是作为模型和视图的桥梁，当模型层数

据改变，vm会检测到并通知视图层进行相应的修改

30.Vue组件中的data为什么是函数

Data是一个函数时，每个组件实例都有自己的作用域，每个实例相互独

立，不会相互影响

如果是引用类型（对象），当多个组件共用一个数据源时，一处数据改变，

所有的组件数据都会改变，所以要利用函数通过return返回对象的拷贝，

（返回一个新数据），让每个实例都有自己的作用域，相互不影响.