fix(Layout/index.vue): 修复移动端无法打开左侧菜单的问题
This commit is contained in:
@@ -16,22 +16,14 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import {computed, watchEffect,markRaw } from "vue"
|
import {computed, watchEffect } from "vue"
|
||||||
import {useWindowSize} from '@vueuse/core'
|
import {useWindowSize} from '@vueuse/core'
|
||||||
import {AppMain, Navbar, Settings,TagsView} from './components/index.ts'
|
import {AppMain, Navbar, Settings,TagsView} from './components/index'
|
||||||
import Sidebar from './components/Sidebar/index.vue'
|
import Sidebar from './components/Sidebar/index.vue'
|
||||||
|
|
||||||
import {useAppStoreHook} from "@/store/modules/app"
|
import {useAppStoreHook} from "@/store/modules/app"
|
||||||
import {useSettingStoreHook} from "@/store/modules/settings"
|
import {useSettingStoreHook} from "@/store/modules/settings"
|
||||||
|
|
||||||
const classObj = computed(() => ({
|
|
||||||
hideSidebar: !useAppStoreHook().sidebar.opened,
|
|
||||||
openSidebar: useAppStoreHook().sidebar.opened,
|
|
||||||
withoutAnimation: useAppStoreHook().sidebar.withoutAnimation,
|
|
||||||
mobile: useAppStoreHook().device === 'mobile'
|
|
||||||
}))
|
|
||||||
|
|
||||||
|
|
||||||
const {width, height} = useWindowSize();
|
const {width, height} = useWindowSize();
|
||||||
const WIDTH = 992
|
const WIDTH = 992
|
||||||
|
|
||||||
@@ -40,10 +32,16 @@ const device = computed(() => useAppStoreHook().device);
|
|||||||
const needTagsView = computed(() => useSettingStoreHook().tagsView);
|
const needTagsView = computed(() => useSettingStoreHook().tagsView);
|
||||||
const fixedHeader = computed(() => useSettingStoreHook().fixedHeader);
|
const fixedHeader = computed(() => useSettingStoreHook().fixedHeader);
|
||||||
|
|
||||||
|
const classObj = computed(() => ({
|
||||||
|
hideSidebar: !sidebar.value.opened,
|
||||||
|
openSidebar: sidebar.value.opened,
|
||||||
|
withoutAnimation: sidebar.value.withoutAnimation,
|
||||||
|
mobile: device.value === 'mobile'
|
||||||
|
}))
|
||||||
|
|
||||||
|
|
||||||
watchEffect(() => {
|
watchEffect(() => {
|
||||||
if (device.value === 'mobile' && sidebar.value.opened == true) {
|
|
||||||
useAppStoreHook().closeSideBar(false)
|
|
||||||
}
|
|
||||||
if (width.value < WIDTH) {
|
if (width.value < WIDTH) {
|
||||||
useAppStoreHook().toggleDevice("mobile")
|
useAppStoreHook().toggleDevice("mobile")
|
||||||
useAppStoreHook().closeSideBar(true)
|
useAppStoreHook().closeSideBar(true)
|
||||||
|
|||||||
Reference in New Issue
Block a user