vue3uniapp实现自定义拱形底部导航栏，解决首次闪烁问题

前言：

        我最初在网上翻阅查找了很多方法，发现大家都是说在page.json中tabbar中添加："custom": true,即可解决首次闪烁的问题，可是添加了我这边还是会闪烁，因此我这边改变了思路，使用了虚拟页面来解决此问题。

效果图：

一：编写

       1. 在page.json中写一个初始页面，pages中的第一个对象是默认展示第一个页面，所以一定要在写一个。

  "pages": [
        {
            "name": "index",
            "path": "pages/index/index",
            "style":{
                "navigationStyle":"custom"
            }
        },

        2.新建index文件

        3.编写index文件，因为我有三个页面，底部会有三个选项，每一个组件对应一个页面，Tabbr是我自定义的底部导航栏

    <view>
        <view>
            <view v-if="pageStatus[0]" class="page__container" :style="pageContainerStyle(0)">
                <scroll-view class="scroll-view" scroll-y>
                    <BasicPage />
                </scroll-view>
            </view>
            <view v-if="pageStatus[1]" class="page__container" :style="pageContainerStyle(1)">
                <scroll-view class="scroll-view" scroll-y>
                    <InquiriesPage />
                </scroll-view>
            </view>
            <view v-if="pageStatus[2]" class="page__container" :style="pageContainerStyle(2)">
                <scroll-view class="scroll-view" scroll-y>