详解uniapp如何解决H5页面双标题
更新时间：2024年10月16日 11:38:09 作者：bug爱好者
Uniapp打包到线上,会出现双标题问题,原因是：通过地址链接访问时,会有个浏览器自身的标题,和uniapp自身的导航栏标题重复,本文给大家介绍了uniapp如何解决H5页面双标题,需要的朋友可以参考下
概述：Uniapp打包到线上，会出现双标题问题，原因是：通过地址链接访问时，会有个浏览器自身的标题，和uniapp自身的导航栏标题重复。
解决方案：通过自定义uniapp项目的标题，然后进行条件编译，只在app和小程序上显示，H5端不显示，即可只显示浏览器自身的标题。
1. pages.json配置
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "统一收银数据大屏",
"enablePullDownRefresh": false,
"navigationStyle":"custom"
}
}
2. 页面配置
<!-- #ifdef MP-WEIXIN -->
<u-navbar title="统一收银数据大屏" > </u-navbar>
<!-- #endif -->
最后关键一步：自定义了导航栏后，必须进行条件编译，让标题只在微信小程序或app上显示，H5端影藏，否则依然会显示两个标题。
3. 最后效果
到此这篇关于详解uniapp如何解决H5页面双标题的文章就介绍到这了,更多相关uniapp H5页面双标题内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了详解在Vue.js编写更好的v-for循环的6种技巧，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-04-04
这篇文章主要介绍了Vue中的$set的使用,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2018-10-10
解决router.beforeEach()动态加载路由出现死循环问题
这篇文章主要介绍了解决router.beforeEach()动态加载路由出现死循环问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-10-10
前几天朋友在做vue项目开发时，有人反映 IOS 上面的滑动点击有点问题，让我们来帮忙解决，于是我就重写了代码，下面把vue仿qq左滑删除组件功能分享到脚本之家平台，需要的朋友参考下吧2018-03-03
本篇文章主要给大家详细代码讲解了vue2.0 elementUI制作面包屑导航栏的过程，对此有兴趣的朋友可以学习下。2018-02-02
Vue的小伙伴们,困扰大家的IE浏览器支持Vue的问题,目前已经找到了一个比较好的解决方案,下面这篇文章主要给大家介绍了关于vue项目兼容IE浏览器的教程步骤,需要的朋友可以参考下2023-03-03
这篇文章主要为大家介绍了Vue之生命周期函数，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助2021-11-11
这篇文章主要为大家详细介绍了VueJs与ReactJS和AngularJS的异同点,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
vue-loader和webpack项目配置及npm错误问题的解决
这篇文章主要介绍了vue-loader和webpack项目配置及npm错误问题的解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-07-07
这篇文章主要介绍了vue2 中二级路由 高亮问题，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下2019-06-06
最新评论