anmo-master/my/shuju/data.vue

<template>
	<view>
		<view class="padding bg">
			<scroll-view scroll-x="true" class="scroll-view">
				<view class="scroll-item" v-for="(item,index) in time" :key="index" :class="tabIndex==index?'active':''"
					@click="changeIndex(index)">
					<view>{{item.name}}</view>
					<view class="margin-top-xs">{{item.data}}</view>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				time: [],
				dateList: [],
				tabIndex: 0
			}
		},
		onLoad() {
			this.getDay()
		},
		methods: {
			changeIndex(index) {
				this.tabIndex = index
			},
			getDay() {
				var arr = []
				for (let i = 0; i < 7; i++) {
					var now = new Date();
					//24 * 3600 * 1000 就是计算一天的时间  
					var date = new Date(now.getTime() + i * 24 * 3600 * 1000);
					var year = date.getFullYear();
					var month = date.getMonth() + 1;
					var day = date.getDate();
					let da = year + "-" + month + "-" + day
					let data = month + "月" + day + '日'
					var weekArray = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
					var week = weekArray[new Date(da).getDay()];
					var order = {
						name: '',
						data: ''
					}
					order.name = week
					order.data = data
					this.dateList.push(da)
					arr.push(order)
				}
				this.time = arr
				console.log(order)
				// return time
			}
		}
	}
</script>

<style>
	page {
		background: #F5F5F5;
	}

	.bg {
		background: #ffffff;
	}

	.scroll-view {
		width: 100%;
		white-space: nowrap;
	}

	.scroll-item {
		display: inline-block;
		width: 130upx;
		padding: 25upx 10upx;
		/* background: #F7F7F7; */
		margin-right: 30upx;
		border-radius: 16upx;
		text-align: center;

	}

	.active {
		background: #E8F9EF;
		color: #00B88F;
		border: 1rpx solid #00B88F;
	}
</style>