vue踩坑不完全指北(3)

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

一.class类名绑定的问题

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

"logoSrc" >

export default {
  data () {
    return {
      logoSrc: './../assets/avatar.png'
    }
  }
}

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

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

或者
vue踩坑不完全指北(3)_第1张图片

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:vue踩坑不完全指北(3)_第2张图片
A:按照es6官网规定的promise语法写

7.关于ref

Q:想直接在原生dom元素生使用ref,通过refs调用,不想再使用query()方式获取,但是无什么用处
A:ref是针对组件的快速选择,而且尤大说 refs访使 refs

8.关于scss引用

Q:scss没引用上
vue踩坑不完全指北(3)_第3张图片
A:右键审查下元素,是未引用到还是未作用上,未作用上说明试图拿局部的样式进行全局样式的覆盖

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

Q:
vue踩坑不完全指北(3)_第4张图片
A:axios是ajax的解决方案,vuex是状态管理的解决方案,它俩无任何关系

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

A:依赖脚手架已经安装的proxyTable进行反向代理,拦截api请求,前端二次分发
vue踩坑不完全指北(3)_第5张图片

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

你可能感兴趣的:(vue)