vue踩坑不完全指北(3)

最近在群里帮别人解答问题，确实发现了不少别人踩了但是自己没有踩到的坑，小小记录下，后面还会继续往里面追加，这应该是一篇很长时间内都不完结的博客

一.class类名绑定的问题

Q:有小伙伴说，
这样不对，但是

这样就对了，而且官网也确实给的是这样的

A:首先第二种[{aa:isActive}]这种格式正确是因为它符合严格的key:value格式，在js语法中key值的引号可以省略，然后第一种呢，它本质是一个数组，里面不加引号的统统为变量，但是你下面又没定义这个变量，所以他就找不到，加上引号之后表示的是字符串，是className，官网给的那个只是一个样例，它的classA表示你既可以在下面以变量形式表示，也可以用字符串表示，他是为了省事，因为只是为了告诉你用法
二.本地图片路径放在data中失效
Q:直接把本地图片地址放在src里是没问题的，但是把地址提取出来，当道 data 里，就引用不到了：

<img :src="logoSrc" >export default {  data () {    return {      logoSrc: './../assets/avatar.png'    }  }}

A:放在模版里是会被 webpack 打包出来 所以可以
而在 js 里写图片路径其实只是字符串 webpack 不会处理
如果想这么做 可以把图片放在最外层的 static 文件夹
或使用 import require 引入

import logoSrc from './../assets/avatar.png'

或者

3.关于多页模式和单页模式

Q:不想在后台系统和电商平台中使用多页模式，但是用户会F5强制刷新导致数据丢失
A:监控浏览器刷新机制，当刷新的时候将用户当前路由存到session中，二次进入则根据session中的理由直接进来，数据重新加载

4.关于管理端用户权限

Q:不同角色进入的页面不同
A:最简单也最省事的一种是把导航理由元信息放在后台接口里，由后台控制权限路由，前端登陆成功后后台返回此人在数据库角色表中对应的路由信息

5.关于解析后台传过来的html字符串

Q:不想使用v-html太low
A:使用{{{}}}

{{{topic.html}}}

var vm = new Vue({
el: ‘#page’,
data: {
topic: {}
}
});

6.关于promise成功回调里写reject

Q:
A:按照es6官网规定的promise语法写

7.关于ref

Q:想直接在原生dom元素生使用ref,通过refs调用，不想再使用query()方式获取，但是无什么用处
A:ref是针对组件的快速选择，而且尤大说refs只在组件渲染完成后才填充，并且它是非响应式的。它仅仅作为一个直接访问子组件的应急方案——应当避免在模版或计算属性中使用refs

8.关于scss引用

Q:scss没引用上

A:右键审查下元素，是未引用到还是未作用上，未作用上说明试图拿局部的样式进行全局样式的覆盖

9.关于axios和vuex的配合使用

Q:

A:axios是ajax的解决方案，vuex是状态管理的解决方案，它俩无任何关系

10.关于开发环境的跨域请求

A:依赖脚手架已经安装的proxyTable进行反向代理，拦截api请求，前端二次分发

这一篇暂时就这莫多了，另开一个博文吧