隐藏移动端的sidebar和navbar
This commit is contained in:
parent
d0a9500201
commit
77afd2a133
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div v-if="isShow" class="navbar">
|
<div class="navbar">
|
||||||
<hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
|
<hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
|
||||||
|
|
||||||
<breadcrumb class="breadcrumb-container" />
|
<breadcrumb class="breadcrumb-container" />
|
||||||
@ -39,16 +39,6 @@ import Hamburger from '@/components/Hamburger'
|
|||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
isShow: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
|
|
||||||
this.isShow = false
|
|
||||||
window.pc = false
|
|
||||||
} else {
|
|
||||||
this.isShow = true
|
|
||||||
window.pc = true
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
|||||||
@ -1,10 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
<div :class="classObj" class="app-wrapper">
|
<div :class="classObj" class="app-wrapper">
|
||||||
<div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
|
<div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
|
||||||
<sidebar class="sidebar-container" />
|
<sidebar class="sidebar-container" v-if="isShow" />
|
||||||
<div class="main-container">
|
<div class="main-container" :style="{'margin-left': isShow ? '': '0'}">
|
||||||
<div :class="{'fixed-header':fixedHeader}">
|
<div :class="{'fixed-header':fixedHeader}">
|
||||||
<navbar />
|
<navbar v-if="isShow"/>
|
||||||
</div>
|
</div>
|
||||||
<app-main />
|
<app-main />
|
||||||
</div>
|
</div>
|
||||||
@ -22,6 +22,11 @@ export default {
|
|||||||
Sidebar,
|
Sidebar,
|
||||||
AppMain
|
AppMain
|
||||||
},
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isShow: true
|
||||||
|
}
|
||||||
|
},
|
||||||
mixins: [ResizeMixin],
|
mixins: [ResizeMixin],
|
||||||
computed: {
|
computed: {
|
||||||
sidebar() {
|
sidebar() {
|
||||||
@ -42,6 +47,13 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
mounted() {
|
||||||
|
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
|
||||||
|
this.isShow = false
|
||||||
|
} else {
|
||||||
|
this.isShow = true
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleClickOutside() {
|
handleClickOutside() {
|
||||||
this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
|
this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user