tabBar uniapp 右上角
时间: 2023-09-11 13:06:40 浏览: 106
uniapp小程序自定义动态tabbar
根据引用和引用,在uniapp中配置tabBar右上角的内容可以通过在pages.json中对相应页面进行配置。在titleNView中的buttons属性中添加一个对象,其中的text属性是用来显示图标的unicode编码。同时,需要在fontSrc属性中指定下载文件中后缀为ttf的图片的本地路径。
而根据引用,要使用iconfont来设置tabBar右上角的图标,需要先将图标代码下载到本地,并将其中的iconfont.ttf文件放入static文件夹中。然后打开iconfont.css文件查看图标对应的unicode编码。最后,在配置项中的text属性中以"\u****"的格式填写对应图标的unicode编码。
在添加事件中,可以使用onNavigationBarButtonTap来监听点击tabBar右上角的事件。通过console.log来输出点击事件的信息。
请注意,以上步骤和方法是用于在uniapp中配置tabBar右上角的内容。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *3* [uniapp 更换导航栏图标并添加事件](https://blog.csdn.net/Nancy617/article/details/116202929)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *2* [uniapp 导航栏自定义图标](https://blog.csdn.net/weixin_51102356/article/details/121245538)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
阅读全文