当前位置: 代码迷 >> 综合 >> uniapp 自定义顶部右侧菜单
  详细解决方案

uniapp 自定义顶部右侧菜单

热度:71   发布时间:2023-12-06 19:01:23.0

//pages.json中
{
            "path": "pages/shopCart/shopCart",
            "style": {
                "navigationBarTitleText": "购物车",
                "app-plus": {
                    "titleNView": {
                        "buttons": [{
                            // #ifdef APP-PLUS
                            "text": "编辑",
                            // #endif
                            "fontSize": "16",
                            "color": "#b6b6b6",
                            "width": 70
                        }],
                        "splitLine": {//导航栏下划线
                            "color": "#F4f4f4",
                            "height": "1px"
                        }
                    }
                }
            }
        },
//导航栏按钮事件
onNavigationBarButtonTap(e) {
        var index = e.index;
        // 按钮文字的改变所需
        // #ifdef APP-PLUS
        var currentWebview = this.$mp.page.$getAppWebview();
        var tn = currentWebview.getStyle().titleNView;
        console.log(tn);
        var text = tn.buttons[0].text;
        console.log(text);
        if (text == '编辑') {
            this.cartStatus = true;
            tn.buttons[0].text = '完成';
            currentWebview.setStyle({
                titleNView: tn
            });
        } else if (text == '完成') {
            this.cartStatus = false;
            tn.buttons[0].text = '编辑';
            currentWebview.setStyle({
                titleNView: tn
            });
        }
        // #endif
    },