H5页面在钉钉浏览器上动态修改标题

问题

钉钉h5在ios手机上的问题: 页面title设置不生效,必须页面强制刷新才能显示。

钉钉浏览器没有监听title属性的变更事件

解决方法

使用钉钉自带的jsapi

  1. 下载对应的包:

    npm install dingtalk-jsapi --save

  2. 在项目中新建js,封装对应的修改标题方法

    import * as dd from 'dingtalk-jsapi';

    // 改变页面title方法
    export const ChangePageTitle = (title: string) => {
    // ready方法确保API加载完成后调用biz.navigation.setTitle来改变页面标题
    dd.ready(() => {
    return dd.biz.navigation.setTitle({
    title: title,
    });
    });
    };

    // 判断是不是钉钉
    export const isDingTalk = window.navigator.userAgent.toLowerCase().includes('dingtalk');

  3. 在对应页面引入该js,使用对应方法

    // 需要使用的页面
    import { ChangePageTitle, isDingTalk } from '@/utils/dingTalk';

    onLoad: function() {
    ChangePageTitle('审批列表');
    },

相关推荐
ywl4708120873 分钟前
springSecurity+jwt,简单版demo
java·前端·servlet
想吃火锅100510 分钟前
【前端手撕】promise.all
前端
lichenyang45312 分钟前
动态加载 vs 延迟加载:为什么 demo 里「延迟」看起来没效果?
前端
cypking26 分钟前
从零搭建 Claude Code + Chrome MCP 浏览器自动化:前端 E2E 端到端测试完整教程(包含增量测试)
前端·chrome·自动化
Levi_J41 分钟前
Vue2 升级 Vue3 项目实战
前端
前端拷贝猿42 分钟前
扫码领券功能需求分析
前端
前端拷贝猿1 小时前
设备活动弹窗功能需求分析
前端
飞天狗1111 小时前
零基础JavaWeb入门——第五课第一小节:九大内置对象 · 第1个:request(请求对象)
java·开发语言·前端·后端·servlet
a15108416931 小时前
记一次大模型探索
java·服务器·前端
石山代码1 小时前
变量与解构
开发语言·前端·javascript