sisMobilePhone/components/weatherProphethomepage/weathercomponents/weatherCalendarCardList40/weatherCalendarCardList40.vue

<template>
	<view class="container">
		<div class="weatherCard" v-for="(item,index) in weatherProphetData_40" :key="index">
			<weatherCalendarCard40 ref="weatherCalendarCard40"></weatherCalendarCard40>
		</div>
	</view>
</template>

<script>
	
	import weatherCalendarCard40 from '../../weathercomponents/weatherCalendarCardList40/weatherCalendarCard40/weatherCalendarCard40.vue';
export default {
	components: {
		"weatherCalendarCard40":weatherCalendarCard40
	},
	data() {
		return {
			width:"",
			height:"",
			weatherProphetData_40:[],
			classNameWeatherBackgroundColor: "threeGradeBlue",
			weatherIcons: [],
			classNameWeatherIconWhite:[],
			windowWidth:"",
			windowHeight:"",
			url:""
		};
	},
	created() {
		this.windowWidth=uni.getSystemInfoSync().windowWidth;
		this.windowHeight=uni.getSystemInfoSync().windowHeight;
		if(this.windowWidth>=768){
			this.url="http://49.4.78.143:8081/WeatherfdController/weatherInformationChangePictureName?model=weatherCardList40,weatherCard40,white30&weatherInformation="
		}else{
			this.url="http://49.4.78.143:8081/WeatherfdController/weatherInformationChangePictureName?model=weatherCardList40,weatherCard40,white22&weatherInformation="
		}
	},
	methods: {
		getWeatherData40(width,height,weatherProphetData_40){
			let _this=this;
			this.width=width;
			this.height=height;
			this.weatherProphetData_40 = weatherProphetData_40;
			//console.log(weatherProphetData_40);
			this.weatherIcons=[];
			for(let i = 0; i < this.weatherProphetData_40.length; i++) {
				this.weatherIcons.push(this.weatherProphetData_40[i].weather);
			}
			this.commitData();			
			
			
		},
		commitData:async function() {
			//获取图标请求
			let _this=this;
			await uni.request({
				url: this.url+ this.weatherIcons,
					data:{
					},
					method:'GET',
					success: function(res) {
						//console.log(res.data)
						_this.classNameWeatherIconWhite=[];
						for(let i=0;i<res.data.length;i++){
							_this.classNameWeatherIconWhite.push(res.data[i]);
						}
						for(let i=0;i<_this.weatherProphetData_40.length;i++){
							_this.$nextTick(function() {
								this.$refs.weatherCalendarCard40[i].getWeatherData(this.width,this.height,this.classNameWeatherBackgroundColor, this.classNameWeatherIconWhite[i], this.weatherProphetData_40[i]);
							})
						}
					},
					fail: () => {
						_this.tips="网络错误，小程序端请检查合法域名";
					},
				});	
			
		},	
		pushWeatherData(){
			let _this=this;
			for(let i=0;i<this.weatherProphetData_40.length;i++){
				this.$nextTick(function() {
					console.log(_this.classNameWeatherIconWhite[0]);
					//this.$refs.weatherCalendarCard40[i].getWeatherData(this.width,this.height,this.classNameWeatherBackgroundColor, this.classNameWeatherIconWhite[i], this.weatherProphetData_40[i]);
				})
			}
		}
	}
};
</script>

<style scoped="scoped">
	.container{
		margin: 0px auto;
		width: 90%;
		height: auto;
		/* margin-left: 22px; */
		
		/* border: 0.5px solid #698086; */
	}
	.weatherCard{
		width: 25%;
		float: left;
		/* margin-left: 6px; */
	}
</style>