uni app 根据选项卡下标跳转对应选项卡页面-蒲公英云

uni app 根据选项卡下标跳转对应选项卡页面

A页面根据下标跳转B选项卡的对应位置

<!--A页面 先给一个对应num-->
<view class="night-box">
    <view @tap="goincident(0)">1</view>
    <view @tap="goincident(1)">2</view>
    <view @tap="goincident(2)">3</view>
    <view @tap="goincident(3)">4</view>
</view>
//根据页面跳转事件对应状态
goincident(num) { 
    uni.navigateTo({ 
    url: `../mon-telemetry/mon-telemetry?type=${ num}`
    })
}

B页面根据传入的状态，对应显示选项卡页面

<u-navbar :is-back="true" back-icon-color="#fff" title="" :background="background">
    <view class="u-tabs-box">
        <u-tabs-swiper activeColor="#ffffff" inactive-color="#ffffff" ref="tabs" :list="list" :current="current" @change="change" :is-scroll="false" swiperWidth="750" bg-color='#2E95FF'></u-tabs-swiper>
    </view>
</u-navbar>
<swiper class="swiper-box" :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish">
    <!-- 遥测越线 -->
    <swiper-item class="swiper-item">
        <scroll-view scroll-y style="height: 100%;width: 100%;">
            <view class="page-box">
            <!--内容-->
            </view>
        </scroll-view>
    </swiper-item>    
    <!--..省略重复代码*3-->
</swiper>
data() { 
            return { 
                background: { 
                    backgroundColor: '#2E95FF',
                },
                list: [{  //选项卡名称
                        name: '1'
                    },
                    { 
                        name: '2'
                    },
                    { 
                        name: '3'
                    },
                    { 
                        name: '4',
                    }
                ],
                current: 0,
                swiperCurrent: 0,
                tabsHeight: 0,
                dx: 0,
            };
        },
        onLoad(option) { 
            this.current = option.type
            this.swiperCurrent = option.type
            ｝