日常开发小问题 （其他）

Axios

1. Axios无法拦截重定向问题

请求服务端时,服务端使用框架检测用户信息,当用户信息过期时会返回302,进行重定向,axios无法拦截302重定向,并且服务端返回的接口与本地地址不同可能会引发跨域的问题. 解决方法:

请求拦截器中添加请求头,告知服务器是一次request请求,
axios.interceptors.request.use(request=>{
    config.headers.common['X-Requested-With'] = 'XMLHttpRequest';
})
或添加默认请求头
axios.default.headers.common['X-Requested-With'] = 'XMLHttpRequest';

element-ui

1. element消息提示框多个同时出现的问题

当提示用户操作是否成功时，多次触发显示多条的问题

解决方法:

1.可以将element-ui消息框二次开发，实现消息框依次出现
2.通过判断页面上类名为 `el-message 或 el-message--（success）...` 的dom数量，如果有该dom，就跳过，否则弹出提示框
if(document.getElementsByClassName('el-message').length == 0)...

XLSX

1. excel导出 （json数据转文档）

function xlsx(json, fields, filename = '.xlsx') {//导出xlsx
    json.forEach(item => {
        for (let i in item) {
        if (fields.hasOwnProperty(i)) {
            item[fields[i]] = item[i];
        }
        delete item[i]; //删除原先的对象属性
        }
    })
    let sheetName = filename //excel的文件名称
    let wb = XLSX.utils.book_new()  //工作簿对象包含一SheetNames数组，以及一个表对象映射表名称到表对象。XLSX.utils.book_new实用函数创建一个新的工作簿对象。
    let ws = XLSX.utils.json_to_sheet(json, { header: Object.values(fields) }) //将JS对象数组转换为工作表。
    wb.SheetNames.push(sheetName)
    wb.Sheets[sheetName] = ws
    const defaultCellStyle = { font: { name: "Verdana", sz: 13, color: "FF00FF88" }, fill: { fgColor: { rgb: "FFFFAA00" } } };//设置表格的样式
    let wopts = { bookType: 'xlsx', bookSST: false, type: 'binary', cellStyles: true, defaultCellStyle: defaultCellStyle, showGridLines: false }  //写入的样式
    let wbout = XLSX.write(wb, wopts)
    let blob = new Blob([s2ab(wbout)], { type: 'application/octet-stream' })
    // fs.saveAs(blob, filename + '.xlsx')
    
    //a标签下载 有条件的可用file-saver下载
    var url = URL.createObjectURL(blob)
    var $a = document.createElement('a');
    $a.setAttribute("href", url);
    $a.setAttribute("download", filename + '.xlsx');
    var evObj = document.createEvent('MouseEvents');
    evObj.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, true, false, 0, null);
    $a.dispatchEvent(evObj);

    // 释放url
    setTimeout(function(){
        URL.revokeObjectURL(url)
    },60*1000)
}

function s2ab(s) {
    var buf;
    if (typeof ArrayBuffer !== 'undefined') {
        buf = new ArrayBuffer(s.length)
        var view = new Uint8Array(buf)
        for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff
        return buf
    } else {
        buf = new Array(s.length);
        for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xFF;
        return buf;
    }
}
//使用
xlsx(obj,obj对应表头,文件名)
obj==[{
    date: '2016-05-03',
    name: '王小虎',
    province: '上海',
    city: '普陀区',
    address: '上海市普陀区金沙江路 1516 弄',
    zip: 200333,
    tag: '公司'
}]
表头=={
    date: '日期',
    name: '姓名',
    province: '城市',
    city: '地区',
    address: '地址',
    zip: 'ip地址',
    tag: '标签'
}

file-saver