前端常用

前端常用

Scroll Down

Vue常用组件

# ajax组件
npm install axios
npm install qs

#element-ui组件
npm install element-ui -S

常用模块

axios封装

import axios from 'axios'
import $qs from 'qs'

let baseURL = process.env.NODE_ENV === 'development' ? 'http://localhost:8080' : ''

let service = axios.create({
    baseURL: baseURL,
    timeout: 1000
})

// 是否允许携带cookie
service.defaults.withCredentials = false

service.interceptors.request.use(
    config => {
        config.headers['Content-Type'] = 'application/x-www-form-urlencoded'
	//设置token
        config.headers['Authorization'] = localStorage.getItem('token')
        return config
    },
    error => {
        return Promise.reject(error)
    }
)


service.interceptors.response.use(
    response => {
        return response
    },
    error => {
        return Promise.reject(error)
    }
)

export default {
    post (url, data = {}) {
        return new Promise((resolve, reject) => {
            service.post(url, $qs.stringify(data))
            .then(response => {
                resolve(response.data)
            }, err => {
                reject(err)
            })
        })
    },
    get (url, params = {}) {
        return new Promise((resolve, reject) => {
            service.get(url, {
                params: params
            })
            .then(response => {
                resolve(response.data)
            })
            .catch(err => {
                reject(err)
            })
        })
    },
    put (url, data = {}) {
        return new Promise((resolve, reject) => {
            service.put(url, $qs.stringify(data))
            .then(response => {
                resolve(response.data)
            }, err => {
                reject(err)
            })
        })
    },
    delete (url, params = {}) {
        return new Promise((resolve, reject) => {
            service.delete(url, {
                params: params
            })
            .then(response => {
                resolve(response.data)
            })
            .catch(err => {
                reject(err)
            })
        })
    }
}

日期转换

function dateFormat(fmt, date) {
    let ret;
    const opt = {
        "Y+": date.getFullYear().toString(),        // 年
        "m+": (date.getMonth() + 1).toString(),     // 月
        "d+": date.getDate().toString(),            // 日
        "H+": date.getHours().toString(),           // 时
        "M+": date.getMinutes().toString(),         // 分
        "S+": date.getSeconds().toString()          // 秒
        // 有其他格式化字符需求可以继续添加,必须转化成字符串
    };
    for (let k in opt) {
        ret = new RegExp("(" + k + ")").exec(fmt);
        if (ret) {
            fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
        };
    };
    return fmt;
}