uniapp里的app-plus的导航栏内的图标不显示问题

img

img

如图所示引入了左右两边两个图标,但不生效
望指教,感谢
是H5环境

在 uniapp 的 app-plus 中,导航栏内的图标不显示可能有以下原因:

  1. 图标路径错误
    在 pages.json 或 manifest.json 中配置的 icon 路径不正确,检查 icon 路径是否正确,是否使用相对路径等。
  2. 图标名称不正确
    icon 图标的文件名必须为 icon.png,其他名称的图标不会被识别为导航栏图标。
  3. 图标大小不正确
    icon 图标大小必须为 30*30 像素,其他大小的图标同样不会被识别为导航栏图标。
  4. 缺少 icon 配置
    在 pages.json 或 manifest.json 没有配置 icon 导致没有图标被加载。请在 pages 数组中的页面配置或 manifest 中配置 icon 信息。
  5. 图标被屏蔽
    如果 icon 配置正确但还是不显示,可能是 HBuilderX 中的 “项目设置” - “APP 插件” 中勾选了 “屏蔽默认图标” 选项,取消该选项即可显示。
  6. 需要清除缓存后重启
    由于 App 已有缓存,需要清除缓存后重启 App 以加载最新资源。
    在 manifest.json 中配置 icon 示例:
json
"app-plus": {
  "icon": "common/icon.png" 
}
在 pages.json 中 page 配置 icon 示例:
json
"pages": [{
  "path": "pages/index/index",
  "style": {
    "navigationBarTitleText": "首页",
    "app-plus": {
      "icon": "common/icon.png" 
    }
  }  
}]