Uniapp设置title

我会带着你远行 2021-08-27 15:09 720阅读 0赞

uniapp加载webview时导航title默认抓取页面title值,单页面不能设置独立title的问题;结合uni.postMessage以及plusMessage事件监听实现,如有更好的方案欢迎讨论。

1.pages.json配置

  1. {
  2. "path": "pages/test/index/index",
  3. "style": {
  4. "navigationBarTitleText": "测试页面"
  5. }

2.动态设置

  1. uni.setNavigationBarTitle({
  2. title: '测试首页'
  3. })

3.webview页面

  • 有pages.json先显示
  • 被webview页面title覆盖
    webview如果是单页面应用只在首次加载后显示index.html的,想要对应页面差异化显示对应title可以结合<strong>uni.postMessage</strong>实现。<br>webview页面需要引用资源。在进入路由之前结合路由设置的title对用显示,如下:</li><li><p>webview页面</p> <p>router.beforeEach((to, from, next) => {</p> <pre><code>if (to.meta.title) { uni.postMessage({ data: { action: to.meta.title } }); } next(); </code></pre><p> });</p> </li><li><p>uniapp页面 监听plusMessage事件</p> <p>// #ifdef APP-PLUS<br> plus.globalEvent.addEventListener(‘plusMessage’, function(msg){ </p> <pre><code>if(msg.data.args.data.name == 'postMessage'){ uni.setNavigationBarTitle({ title: msg.data.args.data.arg.action}) } </code></pre><p> });<br>// #endif</p> </li></ul>

发表评论

表情:
评论列表 (有 0 条评论,720人围观)

还没有评论,来说两句吧...

相关阅读