vue一些相关面试题

Q1：安装一些需要编译的包:提示没有安装python、build失败等 

因为一些 npm 的包安装需要编译的环境,mac 和 linux 都还好,大多都齐全 window 用户依赖 visual studio 的一些库和python 2+, windows的小伙伴都装上: windows-build-tools python 2.x

Q2：我用了 axios , 为什么 IE 浏览器不识别(IE9+)

那是因为 IE 整个家族都不支持 promise, 解决方案:npm install es6-promise// 在 main.js 引入即可// ES6的polyfillrequire("es6-promise").polyfill();

 Q3：我在函数内用了this.xxx=,为什么抛出Cannot set property ‘xxx’ of undefined;

这又是this的套路了..this是和当前运行的上下文绑定的... 

一般你在axios或者其他 promise , 或者setInterval 这些默认都是指向最外层的全局钩子. 

简单点说:"最外层的上下文就是 window,vue内则是 Vue 对象而不是实例!"; 

解决方案: 

暂存法: 函数内先缓存 this , let that = this;(let是 es6, es5用 var) 
箭头函数: 会强行关联当前运行区域为 this 的上下文; 

Q4：我需要遍历的数组值更新了,值也赋值了,为什么视图不更新!

那是因为有局限性啊,官方文档也说的很清楚,只有一些魔改的之后的方法提供跟原生一样的使用姿势(却又可以触发视图更新);

一般我们更常用(除了魔改方法)的手段是使用:this.$set(obj,item,value);

Q5：为什么我的组件间的样式不能继承或者覆写啊!

单组件开发模式下,请确认是否开启了 css模块化功能!也就是scoped(vue-cli 里面配置了,只要加入这个属性就自动启用)。

<style lang="scss" scoped></style>

为什么不能继承或者覆写呢,那时因为每个类或者 id 乃至标签都会给自动在css后面添加hash! 比如：

// 写的时候是这个.trangle{}// 编译过后,加上了 hash.trangle[data-v-1ec35ffc]{}

这些都是在 css-loader 里面配置!!!

Q6：安装模块时命令窗口输出unsupported platform xxx

一般两种情况,node版本不兼容,系统不兼容; 

 解决方案: 要么不装,要么满足安装要求;

Q7：vuex的用户信息为什么还要存一遍在浏览器里(sessionStorage or localStorage)

因为 vuex的 store 干不过刷新啊，保存在浏览器的缓存内,若用户刷新的话,值再取一遍呗;

Q8：the “scope” attribute for scoped slots …. replaced by “slot-scope” since 2.5

这个问题只出现老项目升级到 vue2.5+的时候, 提示就是 scope 现在要用 slot-scope 来代替,但是 scope 暂时可以用,以后会移除

Q9： 组件可以缓存么?

可以,用keep-alive;

不过是有代码的..占有内存会多了...所以无脑的缓存所有组件!!!别说性能好了..切换几次,有些硬件 hold不住的,浏览器直接崩溃或者卡死..

所以keep-alive一般缓存都是一些列表页,不会有太多的操作,更多的只是结果集的更换..给路由的组件meta增加一个标志位,结合v-if就可以按需加上缓存了!

Q10： Vue SPA 没法做优化(SEO)!有解决方案么

可以的,SSR(服务端渲染就能满足你的需求),因为请求回来就是一个处理完毕的 html，现在 vue 的服务端开发框架有这么个比较流行,如下Nuxt.js

Q11： Vue可以写桌面端么?

当然可以,有electron和node-webkit(nw); 我只了解过electron;​​​​​​​

electronelectron-vue: Vue-cli 针对 electron 的脚手架模板​​​​​​​