解决暗色模式网页滚动时白色背景

方法就是给html添加一行

<meta name="color-scheme" content="dark light">

切换暗色模式的时候：

toggleDarkMode() {
  this.$vuetify.theme.dark = !this.$vuetify.theme.dark;
  // 添加 <meta name="color-scheme" content="dark light">
  if (this.$vuetify.theme.dark) {
    document.querySelector("meta[name='color-scheme']").content = "dark";
    // prefers-color-scheme 兼容
    document.querySelector("html").setAttribute("data-prefers-color-scheme", "dark");
  } else {
    document.querySelector("meta[name='color-scheme']").content = "light";
    // prefers-color-scheme 兼容
    document.querySelector("html").setAttribute("data-prefers-color-scheme", "light");
  }
}

效果

参考

https://btxx.org/posts/html-dark-mode/

These 3* Lines of CSS Will Give You Dark Mode for Free*