uniapp 自定义taps切换

作者: gavin 分类: uniapp 发布时间: 2022-02-15 12:36
<template>
	<view class="page">
		<view class="listHeaderSort">
			<text v-for="(item,index) in sort" :key="index" :class="{check:sortCheck == index}"  @tap="changeSort(index)">{{item}}</text>
		</view>
	</view>
</template>
<script>
export default {
	data() {
		return {
                      sort: ['支出','收入'],
		      sortCheck: 0
			};
	},
	methods:{
		changeSort: function(e) {
			var that = this;
			that.sortCheck=e;
		},
	}
}
</script>
<style lang="scss">
	.listHeaderSort{font-size:30rpx;margin-top:50rpx;}
	.listHeaderSort text{padding:10rpx 25rpx;color:#999;margin-right:25rpx;}
	.listHeaderSort text.check{background-color: #f3f4f6;border-radius:40rpx;color:#333;}
</style>