Uniapp实现滑动页面tab的切换

最新推荐文章于 2025-03-14 16:28:03 发布

BarNou

最新推荐文章于 2025-03-14 16:28:03 发布

阅读量2.2k

点赞数

文章标签： vue.js

本文链接：https://blog.youkuaiyun.com/qq_44127479/article/details/127878327

版权

<template>
	<view>
		<!--顶部导航栏-->
		<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll">
			<view class="scroll-view-item_H" v-for="(tab,index) in tabBars" :key="tab.id" :id="tab.id"
				:class="navIndex==index ? 'activite' : ''" @tap="checkIndex(index)">
				{
  {tab.name}}
			</view>
		</scroll-view>

		<!-- 内容 -->
		<swiper :current="navIndex" @change="tabChange" class="content">
			<swiper-item class="swiper_item ">
				设备信息
			</swiper-item>
			<swiper-item class="swiper_item ">
			</swiper-item>
			<swiper-item class="swiper_item ">
				故障信息
			</swiper-item>
			<swiper-item class="swiper_item ">
				缺陷信息