首先要import axios這個包

import axios from 'axios'

然後在mounted中定義一個方法

mounted() {
	this.getCityInfo()
}

再在methods中定義這個方法getCityInfo

methods: {
	getCityInfo() {
		axios.get('api/city.json')
			.then(this.handleGetCityInfoSucc)
}
}

再去定義這個handleGetCityInfoSucc這個方法

methods: {
	handleGetCityInfoSucc(res) {
		
}
}
 

還要在data中定義兩個資料

data （） {
	return {
		cities:{},
		hotCities:[]
	}
}

重寫handleGetCityInfoSucc函式

methods: {
	handleGetCityInfoSucc(res) {
		res =res.data
		if(res.ret && res.data){
			const data = res.data
			this.cities= data.cities
			this.hotCities=data.hotCities
}
}
}

然後去穿給子元件陣列

<city-head :ciites='cities'></city-head>

相當於子元件就能接受到這個資料

子元件利用props接受資料

props: {
	cities:Object
	hotCities:Array
}