如何在其他页面上处于活动状态时更新其他页面标题？

Question

比如说，我在"Create Order"页面，一旦我下单并保存，"Jobs [0]"页面会增加1并显示为"Jobs 1"。像那样的东西。

我已经在 SO 上看到了一些答案，但它使用了 activate 方法，在该方法中，用户必须在页面中才能更改页面标题。请指教

下面是我的侧边栏

Answer 1

您可以使用storage的message_receive事件侦听器来申请，每次您在任何其他选项卡中设置localStorage的任何值时都会调用函数message_receive。

注册事件侦听器，您将从不同选项卡获取消息

window.addEventListener("storage", message_receive);

function message_receive(ev) {
    if (ev.key == 'message') {
        var message=ev.newValue;
        // Set your title here, using document.title='your formatted title'
    }
}

消息广播将消息广播给每个监听器

function message_broadcast(message) {
    localStorage.removeItem('message');
    localStorage.setItem('message',message);
}

Answer 2

假设您的边栏菜单是这样实现的。

<a 
  repeat.for="row of router.navigation"
  href.bind="row.href"
  class.bind="row.isActive ? 'active' : ''"
>${row.title}</a>

您不需要更新路线的标题本身。

无论如何，您正在跟踪 front-end 代码中的工作总数，只需在路线标题后显示该变量 "jobs"。

<a 
  repeat.for="row of router.navigation"
  href.bind="row.href"
  class.bind="row.isActive ? 'active' : ''"
>${row.title} <span if.bind="row.config.name == 'jobs'">[${jobCount}]</span></a>

如何在其他页面上处于活动状态时更新其他页面标题？

how to update other page title while active on other page?

javascript

page-title

typescript

aurelia