1.v-show/v-if的区别
v-show本质是中通过css的display属性来进行操作,v-show="false"相当于display:none(隐藏),true则反之.
v-if在编译时相当于三元表达式,v-if="true"这渲染该节点,为false时不渲染该节点. 备注:当需要操作大量DOM时,最好使用v-show.
2.vue中data为什么是function
多次复用该组件时data返回的数据是全新的,当改变其中一个组件的数据时,其他组件的数据不会污染.
3.vue中双向绑定的原理
通过.defined.property()给每一个属性添加getter、setter,当数据发生改变时会自动调用setter,更新数据,重新挂载到页面.
4.vue生命周期,以及vue生命周期都做什么?
beforecreated:初始化实例,这时候还没有进行数据代理,data、methods、watch等等属性和数据均不能使用.
created:初始化实例之后,数据代理执行完毕,可以拿到data、methods、watch等等属性和数据,但是不能和DOM进行交互,如果非要操作DOM,可以通过$nextTick().
备注:一般这个时候可以进行异步请求,优点:减少了页面挂载的时间.
beforemounted:页面挂载之前,生成虚拟DOM.(这里也可以进行异步请求)
mounted:页面挂载之后.
beforeupdated:更新之前,生成新的虚拟DOM和旧的虚拟DOM进行对比,转化成真实DOM元素.
updated:更新完成之后,这里不能更新数据,会造成递归,进入死循环.
beforedestroyed:组件销毁之前,一般会做一些收尾工作,例如:清除定时器,解绑事件等等
destroyed:组件销毁
5.vue中改变数组内索引的值,数据不更新,如何处理
通过数组索引来修改数据,vue监测不到变化,可以通过内置的方法
例如: .push() .shift() .unshift() .pop() .filters()等等,能过够改变原数组的方法就可以使用
6.vuex
共享数据.
state:数据都会存放在这里.
mucation:state里的数据,必须通过mucation,只能操作同步,不可以操作异步,可通过$strore.commit()
action:可以进行异步请求,想要操作state里的数据,必须context.commit('xxx',xx)
getter:类似computed,返回值依赖其他的值.可以搭建快速访问.
7.v-for中key的作用
新旧虚拟DOM对比的时候,会对比key值是否相等,从而提升性能
8.keep-alive的作用和被keep-alive声明的组件的生命周期
作用:缓存组件
激活时会触发:activited
失去激活时:deactivited
9.发送网络请求在哪个函数中
created、beforemounted、mounted都可以进行发送网络请求
10.vue组件间传值有哪些方式
父向子:props
子向父:$emit
兄弟之间的传值:$eventbus
vuex
11.vue什么时候操作DOM比较合适?操作时发现有的组件获取不到,怎么办?
在钩子函数mounted操作比较合适,获取不到时,可以通过$nextTick,等下一次DOM更新完之后调用
----------------------------------------------------------------
vue的内置指令
- v-model
- v-bind
- v-for
- v-show
- v-html
- v-text
- v-once
- v-on
- v-cloak
- v-pre
vue 的修饰符有哪些
事件修饰符
- .stop
- .prevent
- .once
- .capture
- .self
- .passive v-model修饰符
- .lazy
- .number
- .trim 键盘事件修饰符
- .enter
- .detele
- .space
路由hash模式和histroy模式
hash模式:地址路径拼接 /#/ 其中#后面的值是hash值 优点:hash值不在出现在http请求中 history模式:地址后缀显示每级路径和参数 优点:常用,美观,整洁 缺点:访问深层页面时,会出现404,一般由后端人员解决路径问题
路由记录动态生成面包屑内容
核心思路:this.$route.matched 来获取路由信息 再通过路由设置的mate路由元 (item.mate.title)
vuex 实现 状态持久化
1.通过调用接口的方式+本地存储 核心思路:通过调用action里的方法发送异步请求,得到返回值之后localstroage.set(),通过context.commit()调用mucation里的方法来修改state里的数据 2.本地化存储 通过localstroage.set('xx',xx) 这里注意要转成JSON格式,以及localstroage.get时(JSON.parse())要再进行解析 3.用插件