uniapp选项卡tab切换

方法1-因hidden不支持APP端所以不推荐：

<view class="tab_hd">
	<view class="tab_li" :class="currentTab==0?'on':''" data-current="0" @tap="clickTab">选项卡1</view>
	<view class="tab_li" :class="currentTab==1?'on':''" data-current="1" @tap="clickTab">选项卡2</view>
</view>
<view class="tab_bd" :current="currentTab" duration="300">
	<view class="tab_ct" :hidden="currentTab!=0">内容111111</view>
	<view class="tab_ct" :hidden="currentTab != 1">内容222222</view>
</view>

<script>
	export default {
		data() {
			return {
				currentTab: 0,				
			}
		},
		methods: { 
			//点击切换
			clickTab: function (e) {
				var that = this;
					if (this.currentTab === e.target.dataset.current) {
				return false;
				} else {
					that.currentTab=e.target.dataset.current
				}
			},			
		}
	}
</script>

方法2-代码全部展示用显示隐藏的方式控制

<view class="tab_hd">
	<view class="tab_li" :class="currentTab==0?'on':''" data-current="0" @tap="clickTab">选项卡1</view>
	<view class="tab_li" :class="currentTab==1?'on':''" data-current="1" @tap="clickTab">选项卡2</view>
</view>
<view class="tab_bd" :current="currentTab" duration="300">
	<view class="tab_ct" v-show="currentTab==0">内容111111</view>
	<view class="tab_ct" v-show="currentTab==1">内容222222</view>
</view>

<script>
	export default {
		data() {
			return {
				currentTab: 0,				
			}
		},
		methods: { 
			//点击切换
			clickTab: function (e) {
				var that = this;
					if (this.currentTab === e.target.dataset.current) {
				return false;
				} else {
					that.currentTab=e.target.dataset.current
				}
			},			
		}
	}
</script>

方法3-只显示当前切换内容的代码

<view class="tab_hd">
	<view class="tab_li" :class="currentTab==0?'on':''" data-current="0" @tap="clickTab">选项卡1</view>
	<view class="tab_li" :class="currentTab==1?'on':''" data-current="1" @tap="clickTab">选项卡2</view>
</view>
<view class="tab_bd" :current="currentTab" duration="300">
	<view class="tab_ct" v-if="currentTab==0">内容111111</view>
	<view class="tab_ct" v-if="currentTab==1">内容222222</view>
</view>

<script>
	export default {
		data() {
			return {
				currentTab: 0,				
			}
		},
		methods: { 
			//点击切换
			clickTab: function (e) {
				var that = this;
					if (this.currentTab === e.target.dataset.current) {
				return false;
				} else {
					that.currentTab=e.target.dataset.current
				}
			},
			
		}
	}
</script>