// 开发环境用config下proxyTable的代理地址
var BASE_URL = '/api';
var isPro = process.env.NODE_ENV === 'production'
if(isPro){
BASE_URL= 'http://113.113.113.113:8011' //生产环境下的地址
}
const UrlConfig = {
getUserInfo:BASE_URL +'user/getinfo', //获取用户信息
}
export default {
UrlConfig
};
页面使用方式例如：
this.$http.post(this.URL_CONFIG.UrlConfig.getUserInfo,datas)
.then(res =>{
console.log(res)
}).catch(error =>{
console.log(error)
})
// URL_CONFIG见全局混入中的方法全局混入管理
全局混入主要用于项目中每个页面或模块都会用到的函数方法、计算属性、过滤方法等。
文件所属components>common>mixins>index.js
//以下只是其中一种思路
import URL_CONFIG from '@/assets/js/urlConfig.js';
const mixin = {
data(){
return {
URL_CONFIG:URL_CONFIG
},
methods: {
//像时间戳转换这种方法大多数项目都能用的到，可以写在filter里也可以写在computed里，取决于运用场景
formatDate(date, fmt) {
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
}
let o = {
'M+': date.getMonth() + 1,
'd+': date.getDate(),
'h+': date.getHours(),
'm+': date.getMinutes(),
's+': date.getSeconds()
};
for (let k in o) {
if (new RegExp(`(${k})`).test(fmt)) {
let str = o[k] + '';
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : this.padLeftZero(str));
}
}
return fmt;
},
padLeftZero(str) {
return ('00' + str).substr(str.length);
},
loadPage(path,params){
this.$router.push({
path:path,
query:params
})
}
}
}
export default mixin在main.js中引入
//自定义全局mixin
import mixins from '@/components/common/mixins'
Vue.mixin(mixins)全局指令管理
全局指令主要用于各个项目中由于vue指令不能满足需求，自定义的指令形式，在页面编写过程中可以带来很多的便利。
文件所属components>common>directive>index.js
//以下只是一种思路，主要目的是分享自定义指令的方法
let mydirective = {}
mydirective.install = function (Vue) {
//背景颜色
Vue.directive('bg', {
bind(el, binding) {
el.style.color = '#f6f6f6';
}
}),
//主题色
Vue.directive('color', {
