Dynamically switching between themes

UI Components for Vue
Post Reply
Posts: 3
Joined: 19 Aug 2022, 11:10

17 Feb 2023, 11:58

What would be the best way to dynamically import the theme's CSS file in order to switch between themes? I created a pinia store and depending on the store i would import bootstrap4-dark-blue theme or light-blue theme.
This is my App.vue file:

Code: Select all

<script setup>
import { watch } from 'vue'
import { useThemeStore } from './themeStore'

const themeStore = useThemeStore()

watch(themeStore.$state, (state) => {
  const themeCss = state.darkBlueTheme ? 'dark' : 'light'




I copy the CSS theme files into the style folder and rename them accordingly. Unfortunately this is not working, it works the first time but when toggling the state.darkBlueTheme the theme doesn't switch.
any help would be greatly appreciated

Posts: 66
Joined: 06 Sep 2022, 08:59

09 Mar 2023, 11:32

Hi, I hope the example below helps you. https://primevue.org/theming/#switchthemes

Post Reply

Return to “PrimeVue”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests