@vue/cli 中用axios请求本地json报 404
问题:
@vue/cli 中用axios请求本地json,开始把json放到了static下面,各种报404
解决办法:
json文件需要存在public文件夹下,cli3之后public才是存放静态资源的地方,内置服务器对外暴露静态资源的位置,而不是cli2之前的static了
请求时,直接写axios.get('/student.json',{})即可,/ 直接指向项目下的public文件夹
本地路径也可直接指向public下的任意文件夹,如/menuList.json,这样就可以请求到数据了
<template>
<div id="app">
<div v-for="(item,index) in list" :key="index">{{ item.name }} -- {{ item.age }}</div>
</div>
</template>
<script>
import axios from 'axios'
export default {
name: 'App',
data(){
return {
list:[]
}
},
mounted(){
this.getData()
},
methods:{
getData(){
axios.get('/menuList.json').then( res => {
this.list = res.data.list
})
}
}
}
</script>
<style scoped>
</style>
public\menuList.json
{
"list":[
{ "name": "末晨曦吖","age":18 },
{ "name": "满天星辰不及你","age":999 }
]
}