uniapp导航栏自定义按钮及点击事件

本文链接:https://blog.csdn.net/qq_33807889/article/details/89945674
第一步:显示按钮
假设页面名称为:AddSort

在pages.json中找到AddSort,

{
 "path" : "pages/manageDetail/good/sortManage/AddSort/AddSort",
}

将它改为:

{
  "path" : "pages/manageDetail/good/sortManage/AddSort/AddSort",
  "style" : {
      "navigationBarTitleText" : "添加分类",
      "app-plus": {
          "bounce": "none", //关闭窗口回弹效果
          "titleNView": {
              "buttons": [ //原生标题栏按钮配置,
                  {
                       "type":"none",
                       "text":"\u2713",
                       "float":"right"
                  }
               ]
           }
       }
  }
}

其中style.app-plus.titleNView.buttons.text字段想要什么图标参考:https://blog.csdn.net/qq_33807889/article/details/89493496

不想要图标直接写文字也可以。

这时候在页面中就可以显示出图标(或文字)了。


标题
 

第二步,设置点击事件
在AddSort页面中添加如下代码(与data和onload同级):

onNavigationBarButtonTap(e) {
    console.log("success")        
},

猜你喜欢

转载自www.cnblogs.com/lst619247/p/12009180.html