商品详情: 添加窗口同步关闭事件

@@ -69,6 +69,7 @@ export default {
       }
       }
     },
     },
     hide() {
     hide() {
+      this.$emit('hide');
       this.isVisible = false;
       this.isVisible = false;
     },
     },
     maskClick() {
     maskClick() {

 <template>
 <template>
-  <action-sheet @hidden="onHidden" ref="popup">
+  <action-sheet @hidden="onHidden" @hide="onHide" ref="popup">
     <div class="activity-sheet">
     <div class="activity-sheet">
       <h3>活动详情</h3>
       <h3>活动详情</h3>
       <div class="list" >
       <div class="list" >
         <cube-scroll ref="activityListScroll" :data="list">
         <cube-scroll ref="activityListScroll" :data="list">
           <ul>
           <ul>
             <li v-for="(item, idx) in list" :key="idx">
             <li v-for="(item, idx) in list" :key="idx">
-              <div class="activityName"><span>{{item.promotionTypeStr}}</span> {{item.activityName}}</div>
+              <div class="activity-name"><span>{{item.promotionTypeStr}}</span> {{item.activityName}}</div>
               <div class="sub">{{item.startTimeStr}}-{{item.endTimeStr}}</div>
               <div class="sub">{{item.startTimeStr}}-{{item.endTimeStr}}</div>
             </li>
             </li>
           </ul>
           </ul>
@@ -41,6 +41,9 @@ export default {
     onHidden() {
     onHidden() {
       this.$emit('hidden');
       this.$emit('hidden');
     },
     },
+    onHide() {
+      this.$emit('hide');
+    },
   }
   }
 };
 };
 </script>
 </script>
@@ -89,7 +92,7 @@ export default {
       border-bottom: 1px solid #ccc;
       border-bottom: 1px solid #ccc;
     }
     }
 
 
-    .activityName {
+    .activity-name {
       font-size: 28px;
       font-size: 28px;
       font-weight: bold;
       font-weight: bold;
     }
     }

 <template>
 <template>
   <action-sheet position="right" ref="popup"
   <action-sheet position="right" ref="popup"
                 @hidden="onHidden"
                 @hidden="onHidden"
+                @hide="onHide"
                 @shown="onShown"
                 @shown="onShown"
                 :panelStyle="{background: 'transparent', paddingLeft: '20%'}"
                 :panelStyle="{background: 'transparent', paddingLeft: '20%'}"
                 :hasBorderRadius="false"
                 :hasBorderRadius="false"
@@ -98,6 +99,9 @@ export default {
     onHidden() {
     onHidden() {
       this.$emit('hidden');
       this.$emit('hidden');
     },
     },
+    onHide() {
+      this.$emit('hide');
+    },
     onShown() {
     onShown() {
       // refresh list
       // refresh list
       if (this.$refs.scroll) {
       if (this.$refs.scroll) {

 <template>
 <template>
-  <action-sheet @hidden="onHidden" @shown="onShown" position="right" ref="popup" :full="true">
+  <action-sheet @hidden="onHidden" @hide="onHide" @shown="onShown" position="right" ref="popup" :full="true">
       <div class="buy-sheet">
       <div class="buy-sheet">
         <div class="header">
         <div class="header">
           <div class="back-wrapper flex" @touchend="onBack">
           <div class="back-wrapper flex" @touchend="onBack">
@@ -77,6 +77,9 @@ export default {
     onHidden() {
     onHidden() {
       this.$emit('hidden');
       this.$emit('hidden');
     },
     },
+    onHide() {
+      this.$emit('hide');
+    },
     onShown() {
     onShown() {
       if (this.$refs.sizeList) {
       if (this.$refs.sizeList) {
         this.$refs.sizeList.refreshScroll();
         this.$refs.sizeList.refreshScroll();

 <template>
 <template>
-  <action-sheet @hidden="onHidden" @shown="onShown" ref="popup">
+  <action-sheet @hidden="onHidden" @hide="onHide" @shown="onShown" ref="popup">
     <div class="size-select-sheet">
     <div class="size-select-sheet">
       <div class="select-size">
       <div class="select-size">
         <div class="title" @click="hide">{{config.title}}<i class="cubeic-close"></i></div>
         <div class="title" @click="hide">{{config.title}}<i class="cubeic-close"></i></div>
@@ -148,6 +148,9 @@ export default {
     onHidden() {
     onHidden() {
       this.$emit('hidden');
       this.$emit('hidden');
     },
     },
+    onHide() {
+      this.$emit('hide');
+    },
     onShown() {
     onShown() {
       if (this.$refs.sizeList) {
       if (this.$refs.sizeList) {
         this.$refs.sizeList.refreshScroll();
         this.$refs.sizeList.refreshScroll();

@@ -2,7 +2,7 @@
   <div class="layout">
   <div class="layout">
     <LayoutHeader class="layout-header" :show-back="true" :title="'\u200E'"></LayoutHeader>
     <LayoutHeader class="layout-header" :show-back="true" :title="'\u200E'"></LayoutHeader>
     <div class="layout-context fixscroll">
     <div class="layout-context fixscroll">
-      <cube-scroll :data="imageList" ref="pageScroll">
+      <cube-scroll ref="pageScroll">
         <div class="slide">
         <div class="slide">
           <cube-slide ref="slide" :data="imageList">
           <cube-slide ref="slide" :data="imageList">
             <cube-slide-item v-for="(item, index) in imageList" :key="index">
             <cube-slide-item v-for="(item, index) in imageList" :key="index">
@@ -80,16 +80,16 @@
         <cube-button class="sell" @click="sell">出售</cube-button>
         <cube-button class="sell" @click="sell">出售</cube-button>
         <cube-button class="buy active" @click="buy">购买</cube-button>
         <cube-button class="buy active" @click="buy">购买</cube-button>
       </div>
       </div>
-      <buy-sheet v-if="showBidSheet" @hidden="onBidSheet" :productId="productId"/>
-      <size-request-sheet v-if="showSizeRequestSheet" @hidden="onSizeRequestHidden" :productId="productId"/>
+      <buy-sheet v-if="showBidSheet" @hide="onBidSheetHide" :productId="productId"/>
+      <size-request-sheet v-if="showSizeRequestSheet" @hide="onSizeRequestHide" :productId="productId"/>
     </div>
     </div>
-    <activity-list-sheet v-if="showActivitySheet" :list="activity" @hidden="onActivitySheetHidden"/>
+    <activity-list-sheet v-if="showActivitySheet" :list="activity" @hide="onActivitySheetHide"/>
     <size-select-sheet v-if="showSizeSelectSheet"
     <size-select-sheet v-if="showSizeSelectSheet"
                        :list="sizeList"
                        :list="sizeList"
                        :product="productDetail"
                        :product="productDetail"
                        :image-list="imageList"
                        :image-list="imageList"
                        :config="selectSizeConfig"
                        :config="selectSizeConfig"
-                       @hidden="onSizeSelectSheetHidden"
+                       @hide="onSizeSelectSheetHide"
                        @select="onSelectTradeProduct"
                        @select="onSelectTradeProduct"
                        @add="onRequestSize"/>
                        @add="onRequestSize"/>
   </div>
   </div>
@@ -194,20 +194,25 @@ export default {
 
 
     // 在action-sheet显示控制与对应关闭方法
     // 在action-sheet显示控制与对应关闭方法
     this.actionSheetCloseMap = {
     this.actionSheetCloseMap = {
-      showActivitySheet: 'onActivitySheetHidden',
-      showBidSheet: 'onBidSheet',
-      showSizeSelectSheet: 'onSizeSelectSheetHidden',
-      showSizeRequestSheet: 'onSizeRequestHidden',
+      showActivitySheet: 'onActivitySheetHide',
+      showBidSheet: 'onBidSheetHide',
+      showSizeSelectSheet: 'onSizeSelectSheetHide',
+      showSizeRequestSheet: 'onSizeRequestHide',
     };
     };
   },
   },
   asyncData({store, router}) {
   asyncData({store, router}) {
     const productId = parseInt(router.params.productId, 10);
     const productId = parseInt(router.params.productId, 10);
 
 
+    if (isNaN(productId)) {
+      throw new Error('无效的商品ID');
+    }
+
     return store.dispatch('product/fetchProductInfo', {productId});
     return store.dispatch('product/fetchProductInfo', {productId});
   },
   },
   activated() {
   activated() {
     this.$refs.pageScroll && this.$refs.pageScroll.scrollTo(0, 0, 0);
     this.$refs.pageScroll && this.$refs.pageScroll.scrollTo(0, 0, 0);
     this.loadData(this.productId);
     this.loadData(this.productId);
+    this.refresh();
   },
   },
   beforeRouteUpdate(to, from ,next) {
   beforeRouteUpdate(to, from ,next) {
     if (this.historyBackGuard() === false) {
     if (this.historyBackGuard() === false) {
@@ -236,7 +241,7 @@ export default {
       return true;
       return true;
     },
     },
     refresh() {
     refresh() {
-      this.$refs.slide.refresh();
+      this.$refs.slide && this.$refs.slide.refresh && this.$refs.slide.refresh();
     },
     },
     sizeImg(src, width = 360, height = 72) {
     sizeImg(src, width = 360, height = 72) {
       if (src) {
       if (src) {
@@ -312,12 +317,12 @@ export default {
     },
     },
 
 
     // 关闭活动列表
     // 关闭活动列表
-    onActivitySheetHidden() {
+    onActivitySheetHide() {
       this.showActivitySheet = false;
       this.showActivitySheet = false;
     },
     },
 
 
     // 选择尺寸
     // 选择尺寸
-    onSizeSelectSheetHidden() {
+    onSizeSelectSheetHide() {
       this.showSizeSelectSheet = false;
       this.showSizeSelectSheet = false;
     },
     },
 
 
@@ -424,7 +429,7 @@ export default {
     },
     },
 
 
     // 添加尺寸关闭
     // 添加尺寸关闭
-    onSizeRequestHidden() {
+    onSizeRequestHide() {
       this.showSizeRequestSheet = false;
       this.showSizeRequestSheet = false;
     },
     },
 
 
@@ -434,7 +439,7 @@ export default {
     },
     },
 
 
     // 购买
     // 购买
-    onBidSheet() {
+    onBidSheetHide() {
       this.showBidSheet = false;
       this.showBidSheet = false;
     },
     },
   },
   },
@@ -576,7 +581,7 @@ export default {
       flex-direction: column;
       flex-direction: column;
       justify-content: center;
       justify-content: center;
       align-items: center;
       align-items: center;
-      overflow: hidden;
+      overflow: Hide;
 
 
       div {
       div {
         font-size: 28px;
         font-size: 28px;