1.安装
npm install axios
2.在Home.vue中引入
import axios from 'axios'
export default {
name: 'Home',
components: {
HomeSwiper,
HomeIcons,
HomeRecommend,
HomeWeekend
},
methods: {
getHomeInfo () {
axios.get('/api/index.json').then(this.getHomeInfoSucc)
},
getHomeInfoSucc (res) {
console.log(res)
}
},
mounted () {
this.getHomeInfo()
}
}
3.创建static文件夹,在里面放入要请求的index.json(只有static文件夹是对外暴露的,放别的地方无法访问)
访问网址:http://localhost:8080/static/mock/index.json
4.屏蔽模拟数据,不要上传到git,在.gitignore里添加
static/mock
5.打开config文件夹,修改index.js,对api路径做代理转发
module.export = { dev: { proxyTable: { 'api': { target: 'http://localhost:8080', pathRewrite: { '^api': '/static/mock' } } } } }
6.父组件通过标签属性传值,子组件通过props接收