侧滑菜单支持左滑退出

src/components/app-mob-menu-sideslip-view/app-mob-menu-sideslip-view.vue

 <template>
     <div class="app-mob-menu-sideslip-view">
         <van-popup v-model="showPopup" get-container="#app" position="left" :style="{ height: '100%',width: '80%' }" duration="0.2">
+          <v-touch v-on:swipeleft="onSwipeLeft" style="height:100%;">
               <div class="app-menu-plugin">
                 <div class="header">
                   <img src="assets/images/logo.png" class="ibizLogo"/>
@@ -24,8 +25,9 @@
                   </template>
                 </div>
               </div>
+            </v-touch>
         </van-popup>
-        <v-touch v-on:swiperight="onSwipeLeft" style="height:100%;">
+        <v-touch v-on:swiperight="onSwipeRight" style="height:100%;">
           <template v-for="item in items">
                   <template v-if="!item.hidden">
                           <component  :key="item.id" v-if="item.id == activeId" :is="item.componentname" viewDefaultUsage="indexView"></component>
@@ -45,13 +47,23 @@ import { Environment } from '@/environments/environment';
 export default class AppMobMenuSideslipView extends Vue {
 
     /**
-     * 滑动打开弹出层
+     * 向左滑动关闭弹出层
      *
      * @type {*}
      * @memberof AppMobMenuSideslipView
      */
     public onSwipeLeft(){
-      this.showPopup= true;
+      this.showPopup = false;
+    }
+
+    /**
+     * 向右滑动打开弹出层
+     *
+     * @type {*}
+     * @memberof AppMobMenuSideslipView
+     */
+    public onSwipeRight(){
+      this.showPopup = true;
     }
 
     /**
@@ -212,13 +224,11 @@ export default class AppMobMenuSideslipView extends Vue {
      * @memberof AppMobMenuSideslipView
      */
     public mounted() {
-        let ionNav:any = this.$refs.ionNav;
         let currPage = sessionStorage.getItem("currId");
         if(currPage){
             this.items.forEach((item:any,index:number) => {
                 if(item.id == currPage){
-                    this.activeId =  item.id       
-                    ionNav.select(item.name);
+                    this.activeId =  item.id;    
                 }
             })
         } 
@@ -283,26 +293,6 @@ export default class AppMobMenuSideslipView extends Vue {
         return val;
     }
 
-    /**
-     * 选中菜单项
-     *
-     * @param {*} $event
-     * @returns {void}
-     * @memberof AppMobMenuSideslipView
-     */
-    public selectItem($event: any): void {
-        if (!$event) {
-            return ;
-        }
-        let { detail } = $event;
-        if (!detail) {
-            return ;
-        }
-        let { tab }  = detail;
-        if (!tab) {
-            return;
-        }
-    }
 }
 </script>