uniapp的h5,打开的时候,标题会一闪而过应用名称,再显示当前页面的标题

问题:

微信小程序,通过webview打开了uniapp创建的h5,但是打开h5时,会先显示h5的应用名称,然后才切换为该页面的标题。

过程:

查过很多资料,有说修改应用名称,有说设置navigationStyle等(也就是设置该页面的属性),还有的直接在页面的onReady中设置title的,这些都是只针对单个页面的操作,而且设置之后,对于我的项目还是不起作用。

解决办法:

最后发现,自己项目中,预设了index.html(我的项目放在了public/index.html,有些项目可能直接在根目录下的index.html),而index.html中设置了title,取得是应用名称,所以不管打开哪个页面,都会先显示应用名称,然后再出现该页面标题,修改办法,直接去掉title的设置,或者改为自己想要的。如下,htmlWebpackPlugin.options.title取得是应用名称,可以直接去掉title

复制代码
<!DOCTYPE html>
<html lang="zh-CN">

    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>
            <%= htmlWebpackPlugin.options.title %>
        </title>
        <script>
            document.addEventListener('DOMContentLoaded', function() {
                document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'
            })
            var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
            document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')
        </script>
        <link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
    </head>

    <body>
        <noscript>
            <strong>Please enable JavaScript to continue.</strong>
        </noscript>
        <div id="app"></div>
        <!-- built files will be auto injected -->
    </body>

</html>
相关推荐
spmcor18 小时前
微信小程序 setStorageSync 踩坑实录:别让"顺手一存"变成"隐形炸弹"
微信小程序
用户4324281061141 天前
小程序埋点设计规范:如何设计可扩展的数据采集体系
微信小程序
用户6990304848752 天前
try catch使用场景 处理同步代码错误兼容用的
javascript·uni-app
ITKEY_2 天前
uniapp微信开发者工具 更改AppID失败 touristappid
uni-app
sugar__salt2 天前
从网页小游戏到数据可视化:掌握 HTML5 Canvas 核心能力
前端·信息可视化·html5
meilindehuzi_a2 天前
从 Canvas 到 Vibe Coding:HTML5 游戏开发入门与 AI 飞机大战实战
前端·人工智能·html5
Geek_Vison2 天前
APP瘦身实战:从80MB+砍到15MB——基于小程序容器技术剥离APP非核心业务的实践分享
小程序·uni-app·mpaas
CHB3 天前
HDC2026 演讲实录|AI 驱动的跨端进化:利用 uni-agent 快速构建高性能鸿蒙应用
uni-app·harmonyos
2501_915918413 天前
iOS App性能测试工具的实现方法与优化循环指南
android·ios·小程序·https·uni-app·iphone·webview
玩烂小程序3 天前
微信小程序手串DIY功能开发实录:飞入动画 + 环形排布 + 拖拽换序 + 旋转查看 + 保存设计
微信小程序