Nuxt.js:如何切换颜色模式？

Question

我想切换SPA的颜色模式。我的水疗中心用的是nuxt.js。

有两个bootstrap文件。app.scss app-dark.scss

nuxt.config.js

...

css: [
  '~/plugins/theme/scss/app.scss',
  '~/plugins/theme/scss/app-dark.scss',
],

...

我想使用这些引导scss文件来动态切换颜色模式。

如何解决这个问题？

Answer 1

你可以使用插件@nuxtjs/color-mode来解决这个问题。在那里你可以分配一个覆盖整个应用程序的类(就像app-dark.scss中的.dark-mode )，你还可以分配一个按钮来更新设置。

此插件将首选项保存在cookie和本地存储中。