vue有哪些生命周期
- beforeCreate
- create
- beforeMount
- mounted
- beforeUpdate
- update
- beforeDestory
- destoryed
v-if与v-show有什么区别
- 相同点: v-if与v-show都可以动态控制dom元素显示隐藏
- 不同点: v-if显示隐藏是将dom元素整个添加或删除,而v-show隐藏则是为该元素添加css–display:none,dom元素还在。
vue中修饰符有哪些
- v-mode的修饰符
- .lazy
- .trim
- .number
- 事件修饰符
- .stop => 阻止事件冒泡
- .prevent => 阻止默认行为
- .seif => 变相的算是阻止冒泡
- .once => 只会执行一次
- .sync => 对prop进行双向绑定
- .keyCode => 监听按键的指令
- .capture => 事件的完整机制是捕获-目标-冒泡,事件触发是目标往外冒泡
vue中组件传值的方式有哪些:
- 父传子
- 子传父
- 兄弟传值
- vuex
vue中watch如何监听到一个数组或者对象的变化(非常重要)
- wacth本身是浅监听,只能监听到变量的一个变化
- 要配置深度监听:deep设置true
什么是宏任务与微任务(微信小程序找面试题看,都会有答案:加班猿、前端面试以及知乎)
v-if与v-for哪个优先级高
- 当 Vue 处理指令时,**
v-for
比v-if
具有更高的优先级** - 两者同级出现,每次渲染都会先执行循环再判断条件,无论如何循环都不可避免的浪费性能;
- 避免出现这种情况,可在外层嵌套一层进行v-if判断,然后在内部进行v-for循环
- 如果条件出现在循环内部,可通过计算属性提前过滤掉那些不需要显示的项,减少dom操作
什么是MVVM?有什么优点?(微信小程序找面试题看,都会有答案:加班猿、前端面试以及知乎)
vue中keep-alive的作用
- 作用:用来缓存组件,保存组件状态,避免多次加载相应的组件,减少消耗性能。
- 在实际开发中,需要配合vue-router共同使用
如何修改this的指向
借调
- call
// 尝试一下
function go() {
console.log(this); // this默认代表window
}
let obj = {
name: '小马哥'
}
// 借调
// call()
window.go.call(obj); // 小马哥- apply
// 尝试一下
function go() {
console.log(this); // this默认代表window
}
let obj = {
name: '小马哥'
}
// 借调
// apply()
window.go.apply(obj); // 小马哥- bind
// 特殊一点
window.go.bind(obj); // bind会得到一个函数:不会执行
// 两种执行方式
// 1. 先变量保存绑定的函数:然后+()触发
let fn = window.go.bind(obj);
console.log(fn);
fn();
// 2. 在绑定后,直接+()触发
window.go.bind(obj)();他们的区别:
- call:是以逗号的形式单个顺序传入参数
- apply:是以数组的方式传入参数
- bind:单个顺序传参,上面两个是一次性借调,bind是永久借调,需要手动调用
如何解决跨域问题
- 利用JSONP技术去解决
- 反向代理:在vue项目中的配置文件进行相应的配置
- 让后端放行(解决)