更新记录

1.0.1（2025-08-13）

优化细节

1.0.0（2025-08-12）

初始版本

平台兼容性

云端兼容性

uni-app x(4.25)

yzc-twofloor-view uniappx仿淘宝下拉二楼视图

具体请参考示例代码

部分使用代码如下

<template>
    <view class="page">
        <yzc-twofloor-view ref="twofloor" @backedToHome="backedToHome">
            <template #twoFloorPage>
                <two-floor-page @backHome="backHome"></two-floor-page>
            </template>
            <template #mainPage>
                <main-page ref="mainPage" @sendScrollTop="sendScrollTop" @showTwoFloorAnimation="showTwoFloorAnimation"></main-page>
            </template>
        </yzc-twofloor-view>
    </view>
</template>

<script>
    import TwoFloorPage from './twoFloorPage.uvue';
    import MainPage from './mainPage.uvue';
    export default {
        components: {
            TwoFloorPage,
            MainPage
        },
        data() {
            return {

            }
        },
        methods: {
            sendScrollTop(scrollTop: number, animation: boolean) {
                (this.$refs['twofloor']! as ComponentPublicInstance).$callMethod('sendScrollTop', scrollTop, animation);
            },
            showTwoFloorAnimation() {
                (this.$refs['twofloor']! as ComponentPublicInstance).$callMethod('showTwoFloorAnimation');
            },
            backHome() {
                (this.$refs['twofloor']! as ComponentPublicInstance).$callMethod('backHome');
            },
            backedToHome() {
                (this.$refs['mainPage']! as ComponentPublicInstance).$callMethod('backedToHome');
            }
        }
    }
</script>

<style lang="scss">
  .page {
      width: 100%;
      height: 100%;
      overflow: hidden;
  }
</style>