更新记录

1.2.2（2023-04-13）

优化；

2023-04-13

• 点击优化 by Fog

1.2.1（2023-04-06）

优化；

2023-04-06

• 优化 by Fog

1.2.0（2023-04-06）

新增；

2023-04-06

• 新增传值跳转页面 by Fog

平台兼容性

yt-selector 使用说明

〇、简介

• 这是杭州云童智能科技有限公司使用的小程序端的选项切换组件

一、使用说明

• 右侧点击使用 HBuilderX 导入插件

• 引用组件

<yt-selector switchName1="你好" switchName2="云童" ref="message"></yt-selector> 

• 写入要切换页面组件

<template v-slot:dom1><view class="com">页面1</view></template>
<template v-slot:dom2><view class="com">页面2</view></template>

• 触发切换页面组件

eaasdw() {
    //只能传值1||2，传1 切换页面1，传2 切换页面2，空为undefined
    this.$refs.message.switchPage();
}

• Demo体验 ：微信/支付宝小程序搜索：云童健康

• 如果这个插件帮到了您的项目，请麻烦来给个评分谢谢。提出宝贵的意见当然更好！

• 本插件的设计归云童健康所有

二、参数说明

• props

三、事件说明

• events

四、其他说明

• 无

五、示例代码

<template>
    <view class="content">
        <yt-selector switchName1="你好" switchName2="云童" @switchPageCallback="selectIndex" ref="message">
            <template v-slot:dom1>
                <view class="com">
                    页面1
                </view>
            </template>
            <template v-slot:dom2>
                <view class="com">
                    页面2
                </view>
            </template>
        </yt-selector>
        <view class="mam" @click="clickToSwitchPage">2</view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
            }
        },
        methods: {
            //切换事件回调
            selectIndex(i) {
                console.log(i);
            },
            //只能传值1||2，传1 切换页面1，传2 切换页面2，空为undefined
            clickToSwitchPage() {
                this.$refs.message.switchPage(2);
            }
        }
    }
</script>

<style>
    .com {
        width: 100vh;
        height: 600rpx;
        background-color: aquamarine;
    }

    .mam {
        width: 50rpx;
        height: 50rpx;
        background-color: aqua;
    }
</style>