vue:axios请求本地json路径错误问题及解决
更新时间：2022年06月05日 14:07:57 作者：大佬，咋整啊
这篇文章主要介绍了vue:axios请求本地json路径错误问题及解决，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
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.js
import axios from 'axios'; axios.defaults.baseURL='http://www.escook.cn:3000 ' Vue.prototype.axios=axios
步骤二：组件：newList.vue
created () {
this.axios.get('/api/getnewslist').then(res=>{
console.log(res)
this.newList=res.data.message
})
}注意：this指代vue，要在axios前加上this
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了基于iview-admin实现动态路由的示例代码,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-10-10
这篇文章主要介绍了vue如何实现对请求参数进行签名问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-01-01
这篇文章主要为大家详细介绍了vue组件如何被其他项目引用，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-04-04
Vue Getters和mapGetters的原理及使用示例详解
Vuex的核心概念包括state、mutations、actions、getters和modules,今天,我们要深入探讨其中一个关键部分：getters,以及它的相关辅助函数mapGetters,感兴趣的朋友跟随小编一起看看吧2024-08-08
ref 和 reactive 是 Composition API 中用来声明响应式数据的两个核心函数,在 Vue 3 中,使用 setup 语法糖可以更简洁地使用这些功能,本文将探讨如何使用 ref 和 reactive 来管理状态,并解释它们之间的区别,需要的朋友可以参考下2024-09-09
解决vue2.0路由跳转未匹配相应用路由避免出现空白页面的问题
今天小编就为大家分享一篇解决vue2.0路由跳转未匹配相应用路由避免出现空白页面的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-08-08
这篇文章主要介绍了使用Vue.js创建一个时间跟踪的单页应用的相关资料,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2016-11-11
Vue组件的使用不管是在平常工作还是在面试面试中,都是频繁出现的,下面这篇文章主要给大家介绍了关于Vue中常见的几种传参方式的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-05-05
vue3的ref,computed,reactive和toRefs你都了解吗
这篇文章主要为大家详细介绍了vue3的ref,computed,reactive和toRefs，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助2022-03-03
这篇文章主要介绍了vue+egg+jwt实现登录验证的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-05-05
最新评论