在vue-cli3中使用axios获取本地json

在vue-cli3中，公共文件夹由static变成了public

先把要访问的json放到public文件夹下

使用axios的get方法获取，不能用post，不然会报404

axios.get(`./china-main-city/100000.json`)
          .then((data) => {
            console.log(data)
          })

原文地址：https://www.cnblogs.com/zhaobao1830/p/11799351.html

时间： 2024-10-08 09:57:21

在vue-cli3中使用axios获取本地json的相关文章

vue cli3.0用axios调用本地json数据一直报404

最近在基于vue做后台管理系统时,用了vue cli3.0用axios调用本地json数据一直报404,市面上所有的解决办法都没用,快崩溃了,结果最后发现原因是,vue cli3.0 public 文件夹才是静态资源文件,问题解决,记录一下,以后不再踩坑. 最近发现好多人都踩这个坑,索性把我的结构发出来. 参考地址:https://www.love85g.com/?p=1500 原文地址:https://www.cnblogs.com/dapengFly/p/11359456.html

Vue-cli3.0项目下axios请求本地json文件的数据

1. Vue-cli3.0项目节省了很多文件,比如讲vue-cli3.0之前版本的build/dev-server.js配置放在了vue.config.js中. 2. 在Vue-cli3.0项目的vue.config.js或vue-cli3.0之前版本的build/dev-server.js中配置: const express = require('express')const app = express() var singer = require('./src/db/data/singer.

vue项目中使用axios发送ajax

首先使用npm安装axios: 安装好后可以去package.json中查看相关依赖在HOME.VUE中引入axios 在static目录下新建一个文件夹mock,在里面存放各种模拟数据定义一个获取首页数据的方法,把获取到的数据打印出来获取成功: 在本地测试的时候需要使用mock数据,但是在正式上线或者和服务器联调的时候需要把本地的地址改成获取数据api的地址,有时候请求很多,批量修改就可能出现麻烦在config目录中index.js中proxyTable做如下修改就可以实现接下来把获

Android中利用ContentResolver获取本地音乐和相册

在Android中,例如图库和音乐播放器,它们能够扫描我们的系统,获取到本地的相片跟音乐,这一点是如何做到的呢? 当我们往手机上放图片或者音乐的时候,会在手机内存中某个位置上的某个database中存放图片或者音乐的信息,而我们的应用程序是能够通过ContentResolver去读取到这些数据的. 下面可以先看一下database在哪,如下: 然后在data/data/下面呢,有很多provider提供的数据库,而我们的音乐或者图片就是在一个叫做Media的库下: external是智能手机中内

vue组件+axios访问本地json

import axios from 'axios'export default { name: "AjaxText", data: function () { return { message: {} } }, mounted() { this.cartView(); }, methods:{ cartView() { let vm=this; axios.get("/static/sites.json", {}).then(function (response)

vue脚手架中使用axios

虽然之前用过n次,但大多都是直接在页面中引入axios.js的.今天想换种方式使用,一时间竟不知道怎么配置了.特此记录下. 1.npm 安装axios,文件根目录下安装,指令如下: npm install axios --save-dev 2.在main.js中引入axios. import axios from 'axios' 3.接着将axios改写为Vue的原型属性 Vue.prototype.$http=axios 4.全局配置baseURL(后面如果接口baseURL更改了,可直接修

在vue项目中的axios使用配置记录

默认vue项目中已经安装axios,基于element-ui开发,主要记录配置的相关. axiosConfig.js import Vue from 'vue' import axios from 'axios' import qs from 'qs' import { Message, Loading } from 'element-ui' // 响应时间 axios.defaults.timeout = 5 * 1000 // 配置cookie // axios.defaults.withC

「Vue」vue cli3中axios的基本用法

1.安装axiosnpm i axios -S2.main.js中设置import axios from 'axios'Vue.prototype.$axios = axiosPS:这里有个小坑,axios一定要小写,不知道为什么,大写会出错3.基本使用created(){this.showlunbo()},methods:{showlunbo(){ this.$axios.request({url:'http://www.liulongbin.top:3005/api/getlunbo',me

Vue 使用 Vuex 和 axios 获取接口数据

修改原型链 //main.js import axios from 'axios'; Vue.prototype.$ajax = axios; //修改原型链 // .vue文件 methods:{ getData(){ this.$ajax.get('https://easy-mock.com/mock/5d41481656e5d340d0338e4b/shop/commodity') .then(res => { console.log(res) }).catch(err => { con