vue常见问题汇总（三）

---

一、重复点击路由报错

import Vue from 'vue'
import Router from 'vue-router'

const routerPush = Router.prototype.push
Router.prototype.push = function push(location) {
    return routerPush.call(this, location).catch(error => error)
}

二、返回加密前参数

function objKeySort(arys, isEncodeURI) {
    isEncodeURI = isEncodeURI == undefined ? true : isEncodeURI;
    let newkey = Object.keys(arys).sort();
    let parStr = "";
    for (var i = 0; i < newkey.length; i++) {
        if (isEncodeURI) {
            parStr += newkey[i] + "=" + encodeURIComponent(arys[newkey[i]]) + "&";
        } else {
            parStr += newkey[i] + "=" + arys[newkey[i]] + "&";
        }
    }
    return parStr == "" ? "" : parStr = parStr.substr(0, parStr.length - 1); //返回排好序的新参数
}

三、获取后台二进制流图片

后台接口返回来二进制流图片格式,network上是图片,但是打印出来会是类似于乱码的东西,其实是二进制流格式,这时候就需要转换成base64
这里是vue+axios

//获取验证码
getChkcode() {
    this.$axios.get('/api/chkcode.aspx', {
            responseType: 'arraybuffer'
        })
        .then(response => { //这里的第一次处理后台返回来的二进制留数据 转化为base64 
            return 'data:image/png;base64,' + btoa(
                new Uint8Array(response.data).reduce((data, key) => data + String.fromCharCode(key), '')
            )
        })
        .then(res => { //这一次箭头函数是依赖于第一次.then函数处理的data值
            console.log(res) //这时候打印出来就是base64地址了,直接赋值给:src即可
            this.chkcode = res;
        }, (error) => {
            console.log(error)
        })
},

四、vue-photo-preview全屏无效

异步获取数据后需要在后面加一行代码刷新重置一下

this.$previewRefresh();