()"> 菜单栏 打开菜单栏 </vue-drawer-layout> </template> export default { data() { return {}; }, mounted() {}, methods: { openMenu() { this.$refs.drawerLayout.toggle(); }, closeMenu() { this.$refs.drawerLayout.toggle(false); }, }, }; .drawer { width: 100...
安装 npminstallvue-drawer-layout--save 1. main.js导入 importDrawerLayoutfrom'vue-drawer-layout' Vue.use(DrawerLayout) 1. 2. 完整代码 <template> <vue-drawer-layout:drawer-width="230"ref="drawerLayout"@mask-click="closeMenu()"> 菜单栏 打开菜单栏 </vue-drawer-layout> </template> e...
Or you can set every prop as you want to get a fantastic drawer like mobile QQ has(It act below the main content and with distance is 1/3 of the main content drag). <vue-drawer-layoutref="drawer":drawer-width="800":enable="true":animatable="true":z-index="0":drawable-distance="...
A simple DrawerLayout component like Android has for Vue.js. - GitHub - kecan/vue-drawer-layout: A simple DrawerLayout component like Android has for Vue.js.
npm install vue-drawer-layout --save main.js导入 import DrawerLayout from 'vue-drawer-layout' Vue.use(DrawerLayout) 完整代码 <template> <vue-drawer-layout :drawer-width="230" ref="drawerLayout" @mask-click="closeMenu()"> 菜单栏 打开菜单...
<vue-drawer-layout ref="drawer" :width="width" :enable="true" :animatable="true" :z-index="0" :drawable-distance="Math.floor(width/3)" :content-drawable="true" :backdrop="true" :backdrop-opacity-range="[0,0.4]" @slide-start="handleSlideStart" @slide-move="handleSlideMove" @slide...