2024/04/22（团队开发）

　　今天是敏捷开发的第三天，在今天的例会上，我向我的团队成员分享了有关于tabBar的功能和使用，发现我的团队队友们都认为tabBar在我们这个项目是一个必不可少工具，我们可以按照我昨天设置的那两个页面一样来增加页面实现页面的跳转。我们团队成员设计进入对应页面的方法也就完成了，但是，官方文档中说到tabbar 的页面展现过一次后就保留在内存中，再次切换 tabbar 页面，只会触发每个页面的onShow，不会再触发onLoad。我认为对于我所要完成的功能——上传视频中，不应该直接设置成tabBar页面，我的这个功能应该对应一个新开页面，可以直接关闭退出的而不是保留缓存进行跳转。然后，我今天需要实现的功能就是在这个基础上，设置一个可以直接页面的按钮，这样可以通过点击直接跳转到我所要实现的上传视频页面。

　　然后今天我通过在网上进行搜索和查看官方的文档，找到了一个可以插入tabBar的按钮也就是midButton。官方文档中说midButton没有pagePath，需监听点击事件，自行处理点击后的行为逻辑。监听点击事件为调用API：uni.onTabBarMidButtonTap。

　　然后我们在app.vue的script中写入

    uni.onTabBarMidButtonTap(()=>{
            uni.navigateTo({
                url:"/pages/demo/demo"
            })
            });

就可以实现对midButton绑定页面的跳转

在pages.json中写入

{
    "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
        {
            "path" : "pages/index/index",
            "style" : 
            {
                "navigationBarTitleText" : "首页",
                "enablePullDownRefresh" : false
            }
        },
        {
            "path" : "pages/demo/demo",
            "style" : 
            {
                "navigationBarTitleText" : "Vue demo",
                "enablePullDownRefresh" : false
            }
        },
        {
            "path" : "pages/userinformation/userinformation",
            "style" : 
            {
                "navigationBarTitleText" : "我",
                "enablePullDownRefresh" : false
            }
        },
        {
            "path" : "pages/index/preVideo/preVideo",
            "style" : 
            {
                "navigationBarTitleText" : "",
                "enablePullDownRefresh" : false
            }
        }
    ],
    "globalStyle": {
        "navigationBarTextStyle": "black",
        "navigationBarTitleText": "uni-app",
        "navigationBarBackgroundColor": "#F8F8F8",
        "backgroundColor": "#F8F8F8"
    },
    "uniIdRouter": {},
    "tabBar": {
        "color": "#888888",
        "backgroundColor": "#313131",
        "selectedColor": "#fff",
        "height": "60px",
        "fontSize": "20px",
        "list": [
            {
                "text": "首页",
                "pagePath": "pages/index/index"
            },{
                "text": "我",
                "pagePath": "pages/userinformation/userinformation"
                
            }
        ],
        "midButton": {
            "height": "60px",
            "width": "80px",
            "backgroundImage": "static/image/uploadviedo.jpg"//按钮对应的图片
        }
    }
}

就可以添加按钮并跳转了