uniapp开发钉钉小程序自定义导航栏无法点击

uniapp开发钉钉小程序自定义导航栏无法点击

---

前言

用uniapp开发钉钉小程序

---

一、问题

自定义导航栏，在左侧添加几个图标，但是运行到钉钉小程序开发工具上无法点击。

二、解决

1.原因

钉钉小程序（基于支付宝小程序架构）的原生导航栏与自定义导航栏之间存在层级和事件穿透问题

2.准备工作

1.钉钉小程序开发工具下载：https://open.dingtalk.com/document/resourcedownload/miniapp-tool
2.uniapp开发文档：https://uniapp.dcloud.net.cn/collocation/pages.html#customnav

3.解决方法

{
  "path": "pages/ai/ai",  
  "style": {  
    "navigationBarTitleText": "",  // 导航栏标题文字内容，
    "navigationStyle": "custom",  // 启用自定义导航栏模式（隐藏默认导航栏）
    "transparentTitle": "always",  // 导航栏透明设置，always表示始终透明
    "allowsBounceVertical": "NO",  // 禁止页面上下弹性拉动效果（避免页面顶部出现空白）
    "titlePenetrate": "YES"  // 允许点击事件穿透导航栏区域（解决自定义导航栏点击失效问题）
  }
}

---

总结

后面开发钉钉小程序再有什么问题，可以参考支付宝小程序相关的开发文档解决方法。