Fixed light-dark switch on chart demo
parent
85ec13142b
commit
30804d993e
1
app.vue
1
app.vue
|
@ -32,6 +32,7 @@ export default {
|
||||||
this.$primevue.changeTheme(this.$appState.theme, event.theme, 'theme-link', () => {
|
this.$primevue.changeTheme(this.$appState.theme, event.theme, 'theme-link', () => {
|
||||||
this.$appState.theme = event.theme;
|
this.$appState.theme = event.theme;
|
||||||
this.$appState.darkTheme = event.dark;
|
this.$appState.darkTheme = event.dark;
|
||||||
|
EventBus.emit('theme-change-complete', { theme: event.theme, dark: event.dark });
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -12,7 +12,10 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import EventBus from '@/layouts/AppEventBus';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
themeChangeListener: null,
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
chartData: null,
|
chartData: null,
|
||||||
|
@ -163,9 +166,18 @@ const setChartOptions = () => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
beforeUnmount() {
|
||||||
|
EventBus.off('theme-change-complete', this.themeChangeListener);
|
||||||
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.chartData = this.setChartData();
|
this.chartData = this.setChartData();
|
||||||
this.chartOptions = this.setChartOptions();
|
this.chartOptions = this.setChartOptions();
|
||||||
|
|
||||||
|
this.themeChangeListener = () => {
|
||||||
|
this.chartOptions = this.setChartOptions();
|
||||||
|
};
|
||||||
|
|
||||||
|
EventBus.on('theme-change-complete', this.themeChangeListener);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
setChartData() {
|
setChartData() {
|
||||||
|
|
Loading…
Reference in New Issue