刷新页面时怎么记住tabbar的选中状态

要记住tabbar的选中状态，可以考虑使用浏览器的本地存储功能（如localStorage或sessionStorage），在tabbar选中状态改变时，将当前选中的tabbar的索引值存储到本地存储中；在页面刷新时，从本地存储中读取上次选中的tabbar的索引值，并将其对应的tabbar选中。这样就可以实现刷新页面时记住tabbar的选中状态了。需要注意的是，本地存储中存储的数据需要在适当的时候清除，否则可能会出现一些问题。

相关问题

uniapp刷新tabbar页面

在Uniapp中，当切换tabbar页面时，可能会出现页面刷新的问题。有几种解决方法可以尝试。

一种方法是在pages.json文件中设置原生tabbar，并在页面运行时隐藏原生tabbar，以解决闪烁问题。这可以通过在页面的onLoad或onShow生命周期函数中使用uni.hideTabBar()来实现。这样，当页面加载或显示时，原生tabbar将被隐藏，避免了页面刷新时的闪烁问题。\[1\]

另一种方法是将自定义tabbar的跳转方式改为uni.switchTab()，而不是使用navigator等其他跳转方式。使用uni.switchTab()可以确保底部tabbar在页面切换时不会跟着刷新而闪烁。例如，可以使用uni.switchTab({ url: path })来实现tabbar的跳转。\[2\]

如果遇到无法使用原生tabbar实现的需求，可以考虑自行封装tabbar组件。在封装tabbar组件时，需要确保tabbar选项在页面切换时正确激活，并且有激活和非激活状态的样式。这样可以在页面切换时保持tabbar的正确状态，避免刷新问题。\[3\]

综上所述，可以通过设置原生tabbar并隐藏、使用uni.switchTab()跳转或自行封装tabbar组件来解决Uniapp中刷新tabbar页面的问题。
#### 引用[.reference_title]
- *1* *3* [uniapp自定义tabbar](https://blog.csdn.net/weixin_45855502/article/details/129309134)[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^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* [uniapp 小程序使用自定义tabbar时 页面刷新闪烁问题](https://blog.csdn.net/gyl_sunshine/article/details/123233326)[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^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]

uniapp 怎么页面刷新tabbar

在uniapp中，可以通过uni.setTabBarItem()方法来刷新tabbar页面。通过该方法，你可以动态地改变tabbar的文字、图标等内容。首先，你需要准备两套tabbar来实现此功能。一种是自定义的tabbar，另一种是uniapp原生的tabbar。然后，使用uni.setTabBarItem()方法来设置tabbar的相关属性，包括索引、文字、图标等。每当需要刷新tabbar时，调用该方法即可。需要注意的是，刷新tabbar后可能需要重新加载页面才能生效。具体的实现代码如下所示：

uni.setTabBarItem({
  index: 0, // tabbar索引，第一个为0
  text: 'tabbar文字信息',
  iconPath: '/static/images/dingbu.png', // tabbar默认图片路径
  selectedIconPath: 'static/images/dingbu.png' // tabbar选中后的图片路径
})

通过调用以上代码，你可以更新tabbar的相关属性，从而实现页面的刷新。<span class="em">1</span><span class="em">2</span>
#### 引用[.reference_title]
- *1* [uniapp动态修改tabbar](https://blog.csdn.net/king_sur/article/details/126263584)[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_2"}}] [.reference_item style="max-width: 50%"]
- *2* [微信小程序tabBar 返回tabBar不刷新页面](https://download.csdn.net/download/weixin_38670707/12938719)[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_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]