2022-06-06 10:54:06 来源 : 软件开发网
axios请求本地json路径错误
axios的基础路径如何设置
举个栗子吧↓
步骤一：入口文件：main.js
步骤二：组件：newList.vue
axios请求本地json路径错误本例用的是vuecli4，json等静态资源存放在public文件夹中
返回404
this.axios.get("public/redeme.json").then((res) => { console.log(res.data) })其实vue从代码到界面展示还要经过编译，所以路径会有所改变
实际路径可以先打包一下，我是这么找到json的路径的
打包后的文件目录如下
所以我把路径改成：
this.axios.get("./redeme.json").then((res) => { console.log(res.data) })获取成功：
axios的基础路径如何设置在不通过接口文件的情况下，如何使用axios呢？
在组件中调用axios，没必要一定在接口文件中设置，你可以选择在入口文件中设置基础访问路径，在组件中通过this.axios这个方法发送异步请求即可。
举个栗子吧↓项目要求：所有api的域名为：http://www.escook.cn:3000 如果后面文档中，有的域名地址和这里不一样，以这里的为主；
请求接口：/api/getnewslist
请求方式：get
具体代码如下：
步骤一：入口文件：main.jsimport axios from "axios";axios.defaults.baseURL="http://www.escook.cn:3000 "Vue.prototype.axios=axios 步骤二：组件：newList.vuecreated () { this.axios.get("/api/getnewslist").then(res=>{ console.log(res) this.newList=res.data.message }) }注意：this指代vue，要在axios前加上this
以上为个人经验，希望能给大家一个参考，也希望大家多多支持软件开发网。
关于我们 加入我们 广告服务 网站地图
All Rights Reserved, Copyright 2004-2020 www.830036.com
如有意见请与我们联系 邮箱：435 227 67@qq.com
营业执照公示信息