docs: 优化 夜间主题 切换策略

This commit is contained in:
就眠儀式 2022-04-02 06:43:28 +08:00
parent 90bb7f7fc5
commit 497e117567
3 changed files with 6 additions and 18 deletions

View File

@ -140,8 +140,10 @@
<li class="layui-nav-item"> <li class="layui-nav-item">
<a href="javascript:void(0)"> <a href="javascript:void(0)">
<lay-switch <lay-switch
v-model="isDark" v-model="theme"
class="switch" class="switch"
onswitch-value="dark"
unswitch-value="light"
onswitch-color="rgba(255, 255, 255, 0.05)" onswitch-color="rgba(255, 255, 255, 0.05)"
unswitch-color="rgba(255, 255, 255, 0.05)" unswitch-color="rgba(255, 255, 255, 0.05)"
> >
@ -223,7 +225,6 @@ export default {
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
const locale = ref("zh_CN"); const locale = ref("zh_CN");
const isDark = ref(false);
const locales = [ const locales = [
{ name: "zh_CN", locale: zh_CN, merge: true }, { name: "zh_CN", locale: zh_CN, merge: true },
{ name: "en_US", locale: en_US, merge: true }, { name: "en_US", locale: en_US, merge: true },
@ -268,14 +269,6 @@ export default {
import.meta.env.LAYUI_VUE_VERSION import.meta.env.LAYUI_VUE_VERSION
) )
watch(isDark, () => {
if (isDark.value) {
theme.value = "dark";
} else {
theme.value = "light";
}
});
watch( watch(
() => route.path, () => route.path,
(val) => { (val) => {
@ -292,7 +285,6 @@ export default {
locale.value = lang; locale.value = lang;
}; };
provide("isDark",isDark);
provide("theme",theme); provide("theme",theme);
provide('LayuiVueVersion', layuiVueVersion); provide('LayuiVueVersion', layuiVueVersion);
@ -301,7 +293,6 @@ export default {
menus, menus,
theme, theme,
locale, locale,
isDark,
locales, locales,
currentPath, currentPath,
handleClick, handleClick,

View File

@ -18,7 +18,7 @@
</router-link> </router-link>
<a class="layui-inline site-down" href="javascript:void(0);" @click="changeTheme"> <a class="layui-inline site-down" href="javascript:void(0);" @click="changeTheme">
{{ isDark ? 'Turn Off' : 'Turn On'}} {{ theme === 'dark' ? 'Turn Off' : 'Turn On'}}
</a> </a>
</div> </div>
<div class="site-version"> <div class="site-version">
@ -115,11 +115,9 @@ export default {
setup() { setup() {
const { t } = useI18n(); const { t } = useI18n();
const layuiVueVersion = inject('LayuiVueVersion') const layuiVueVersion = inject('LayuiVueVersion')
const isDark = inject("isDark");
const theme = inject("theme"); const theme = inject("theme");
const changeTheme = () => { const changeTheme = () => {
isDark.value = !isDark.value;
if(theme.value === 'dark') { if(theme.value === 'dark') {
theme.value = 'light'; theme.value = 'light';
} else { } else {
@ -129,7 +127,6 @@ export default {
return { return {
t, t,
isDark,
theme, theme,
changeTheme, changeTheme,
layuiVueVersion layuiVueVersion