You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
32 lines
654 B
32 lines
654 B
<template>
|
|
<view :class="{'dark-mode': isDarkMode}" class="theme-provider">
|
|
<slot></slot>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters, mapMutations } from 'vuex'
|
|
|
|
export default {
|
|
name: 'ThemeProvider',
|
|
computed: {
|
|
...mapGetters(['isDarkMode', 'currentTheme'])
|
|
},
|
|
methods: {
|
|
...mapMutations(['toggleThemeMode', 'setThemeMode'])
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.theme-provider {
|
|
/* 确保占满容器，但不影响布局 */
|
|
width: 100%;
|
|
height: 100%;
|
|
|
|
/* 适配应用到深色模式的样式 */
|
|
&.dark-mode {
|
|
/* 这里不添加具体样式，由子元素通过对应的类应用样式 */
|
|
}
|
|
}
|
|
</style>
|