【前端】vue如何定义一个变量,让所有组件都能使用
如图,每个get和post请求都一个url,项目进行太多的数据交互 所以需要把每个url的相同部分定义成一个变量,
这样方便以后修改 但我不懂如何在vue里面定义一个公共变量,让所有组件都能使用。希望大家帮帮忙,谢谢
回答
这个跟vue ,貌似没关系吧。如果是用ES6,就可以用 const 模块来做了。
// api.jsexport const BASE_URL = '//192.168.1.117:1009/'
... ...
调用:
import { BASE_URL } from 'api'this.$http.get(`{BASE_URL}/cas/doc/docTypeList`)
...
这类问题,可以借鉴redux
里面针对模块定义的方案。
vue 也有同款:vuex
为什么不用axios库开进行接口调用呢?
vue官方都用这个库来做调用接口
axios可以直接指定host公共部分
import axios from 'axios'axios.defaults.baseURL = 'http://localhost:8889'
axios.post(url[, data[, config]])
当然你如果就想用原生的话,你可以自己封装一个请求方法,把host封装在方法里面,你自己调用的时候只传url部分
API.js
var API='xxxxx';exports.API=API;
import API from './API'
API.API
写个Vue插件啊,插件是全局的。
全局变量window或者vuex,或者vue.prototype扩展一个变量
不管你用的是vueResource还是axios.他都可以设置baseUrl的....
可参考类似 @monster1935 的 Vue 另类的状态管理 https://github.com/kenberkele...
server.js
const queryToken = (params)=>{ return $http.post(`http://www.baidu.com/getToken`,params);
}
export {
queryToken
}
demo.vue
import { queryToken } from 'server.js'
写一个保存常量的js文件,在需要用的组件里用import引进
可以参考这个博客: http://blog.csdn.net/gebitan5...
以上是 【前端】vue如何定义一个变量,让所有组件都能使用 的全部内容, 来源链接: utcz.com/a/81586.html