我是靠谱客的博主 糟糕背包,这篇文章主要介绍vue axos在main.js文件中配置根路径及url的全局请求axios配置全局路径main.js配置axios根路径的简写,现在分享给大家,希望可以做个参考。
axios配置全局路径
在main.js中使用vue构造函数设置axios的配置,再由子组件不需要引入的情况下直接使用。
main.js文件中
//首先在main.js中导入axios模块
import axios from 'axios'
//使用vue构造函数指向axios模块,并由$http接受,
//在其他组件中直接使用this.$http.post/get等调用
//配置axios的全局设置
vue.prototype.$http = axios
子组件中
methods: {
async foo() {
const { data: res } = await this.$http.get('请求地址')
console.log(res)
}
}
main.js配置axios根路径的简写
配置axios的根路径,再修改url地址的时候自动匹配到端口,不用程序员再每个vue组件中依次修改。
import axios from 'axios'
//配置默认的url请求路径,可以直接修改,子组件直接调用
vue.defaults.baseURL = 'https://id地址:端口号'
//配置axios的全局设置
vue.prototype.$http = axios
子组件中
methods: {
async foo() {
const { data: res } = await this.$http.get('/api/hu')
console.log(res)
}
}
最后
以上就是糟糕背包最近收集整理的关于vue axos在main.js文件中配置根路径及url的全局请求axios配置全局路径main.js配置axios根路径的简写的全部内容,更多相关vue内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复