浏览器弹出提醒

浏览器弹出提醒

统计信息：字数 1240 阅读3分钟

在谷歌浏览器中可以实现弹框提示，可以自定义弹框的内容。主要使用 window.Notification 这个对象

// 弹出提示框
popupBrowserNotification = () => {
    // 判断浏览器内部是否支持弹出提醒
  if (!('Notification' in window)) {
    return;
  }
  const Notification = window.Notification;
  if (Notification.permission === 'granted') {
    this.render();
  } else if (Notification.permission !== 'denied') {
    Notification.requestPermission(function (permission) {
      if (permission === 'granted') {
        this.render();
      }
    });
  }
}

render = () => {
  new Notification(t('Notification'), {
    body: t('Your_table_xxx_has_a_new_comment', {table_name: fileName})
  });
}

// 获取提示的内容
getNotificationContent = (value) => {
  let regex = /(@\[([^\]]+?)\]\(([^\]]+?)\))/g;
  let match;
  let start = 0;
  let newValue = '';
  while((match = regex.exec(value)) !== null) {
    let notificationName = `@${match[2]}`;
    let substr = value.substring(start, match.index);
    start = regex.lastIndex;
    newValue += substr + notificationName;
  }
  if (start < value.length) {
    newValue += value.slice(start);
  }
  return newValue;
}

---

Last update: November 9, 2024