vue项目（cp网站搭建制作）及axios请求获取数据

一般vue项目中 一个页面是由多个组件组成的，各个组建的数据都是统一在主界面的组件中发送axios请求获取，这样极大地提高了性能。

一、首先导入用到的组件和axios
cp网站搭建制作q<115.28.8.00.9.9>
import HomeHeader from './components/Header'
import HomeSwiper from './components/Swiper'
import HomeIcons from './components/Icons'
import HomeRecommend from './components/Recommend'
import HomeWeekend from './components/Weekend'
import axios from 'axios'
export default {
name: 'Home',
components: {
HomeHeader,
HomeSwiper,
HomeIcons,
HomeRecommend,
HomeWeekend
},

二、在data中将要用到的数据给一个初始值，为空
data () {
return {
swiperList: [],
iconList: [],
recommendList: [],
weekendList: []
}
},

三、在methods中写方法，发送axios获取数据
methods: {
getHomeInfo () {
axios.get('/api/index.json')
.then(this.getHomeInfoSucc)
},
getHomeInfoSucc (res) {
res=res.data
if (res.ret && res.data) {
const data = res.data
this.swiperList = data.swiperList
this.iconList = data.iconList
this.recommendList = data.recommendList
this.weekendList = data.weekendList
}
}
},
mounted () {
this.getHomeInfo()
}
}