前端工作总结241-uni-状态不同选择

<template>
	<view class="">
		<u-subsection :list="list" :current="current" mode="button" :animation="true" bg-color="white" button-color="white"
		 @change="cheange"></u-subsection>
		<view class="wrap">
			<view v-if="current == 0" class="">
				<navigator v-for="(item,index) in tableData" url="../party_building_detail/party_building_detail">
					<view class="system">
						<view class="t-title">
							{{item.title}}
						</view>
						<view class="u-flex  ">
							<u-icon name="clock-fill" color="#999999" size="28"></u-icon>
							<view class="t-time">
								{{item.startDate}}
							</view>
						</view>
					</view>
				</navigator>
			</view>
 
 
		</view>
	</view>
</template>
 
<script>
	export default {
		data() {
			return {
				tableData: [],
				list: [{
						name: '法律法规'
					},
					{
						name: '政策文件'
					},
					{
						name: '管理宝典'
					},
					{
						name: '最新资讯'
					}
				],
				current: 0
			}
		},
		/* 第一步定义onload方法 */
		onLoad() {
			/* 调用市场信息的接口 分别 vuex获取 其他三项 */
			this.$u.api.getpartyList({
				marketId: this.vuex_user.market_id,
				pageNo: 1,
				pageSize: 20,
				type:"法律法规"
			}).then(res => {
				if (res.data.code == 200) {
					this.tableData = res.data.data.records
					console.log(1)
					console.log(res)
				}
			})
		},
		methods: {
			cheange(index) {
				console.log(index)
				this.current = index
				console.log(this.list[index].name)
				this.$u.api.getpartyList({
					marketId: this.vuex_user.market_id,
					pageNo: 1,
					pageSize: 20,
					type:this.list[index].name
				}).then(res => {
					if (res.data.code == 200) {
						this.tableData = res.data.data.records
						console.log(1)
						console.log(res)
					}
				
				})
			}
		}
	}
</script>
 
<style lang="scss">
	.wrap {
		padding: 30rpx;
 
		.system {
			font-family: PingFangSC;
			font-weight: 400;
			opacity: 1;
			padding: 30rpx 0;
 
			.t-title {
				font-size: 30rpx;
				line-height: 40rpx;
				color: #333333;
				margin-bottom: 30rpx;
			}
 
			.t-time {
				font-size: 24rpx;
				line-height: 40rpx;
				color: #999999;
				margin-left: 12rpx;
			}
		}
 
		.sub-btn {
			width: 684rpx;
			height: 96rpx;
			background: linear-gradient(91deg, #43B9FD 0%, #1FB5FE 100%);
			opacity: 1;
			border-radius: 66rpx;
			border: 0rpx;
			font-size: 36rpx;
			font-family: PingFangSC;
			font-weight: 400;
			line-height: 40rpx;
			color: #FFFFFF;
			position: fixed;
			bottom: 18rpx;
		}
	}
</style>
 

前端