diff --git a/src/image-viewer/image-viewer.less b/src/image-viewer/image-viewer.less
index 0a297eb7d..ee9c3a36a 100644
--- a/src/image-viewer/image-viewer.less
+++ b/src/image-viewer/image-viewer.less
@@ -68,10 +68,17 @@
 
     &-close {
       margin-left: @image-viewer-close-margin-left; // 关闭操作按钮左部间距
+
+      &:empty {
+        display: none;
+      }
     }
 
     &-delete {
       margin-right: @image-viewer-delete-margin-right; // 删除操作按钮右部间距
+      &:empty {
+        display: none;
+      }
     }
 
     &-close,
diff --git a/src/image-viewer/image-viewer.ts b/src/image-viewer/image-viewer.ts
index 2fa3078ce..7e70188d2 100644
--- a/src/image-viewer/image-viewer.ts
+++ b/src/image-viewer/image-viewer.ts
@@ -1,4 +1,4 @@
-import { styles, setIcon } from '../common/utils';
+import { styles, calcIcon } from '../common/utils';
 import { SuperComponent, wxComponent } from '../common/src/index';
 import config from '../common/config';
 import props from './props';
@@ -45,17 +45,15 @@ export default class ImageViewer extends SuperComponent {
       });
     },
 
-    closeBtn(closeBtn) {
-      const obj = setIcon('closeBtn', closeBtn, 'close');
+    closeBtn(v) {
       this.setData({
-        ...obj,
+        _closeBtn: calcIcon(v, 'close'),
       });
     },
 
-    deleteBtn(deleteBtn) {
-      const obj = setIcon('deleteBtn', deleteBtn, 'delete');
+    deleteBtn(v) {
       this.setData({
-        ...obj,
+        _deleteBtn: calcIcon(v, 'delete'),
       });
     },
   };
@@ -132,8 +130,9 @@ export default class ImageViewer extends SuperComponent {
       this._trigger('change', { index: current });
     },
 
-    onClose() {
-      this._trigger('close', { visible: false, trigger: 'button', index: this.data.currentSwiperIndex });
+    onClose(e) {
+      const { source } = e.currentTarget.dataset;
+      this._trigger('close', { visible: false, trigger: source || 'button', index: this.data.currentSwiperIndex });
     },
 
     onDelete() {
diff --git a/src/image-viewer/image-viewer.wxml b/src/image-viewer/image-viewer.wxml
index 40372e607..fc0e3e7f2 100644
--- a/src/image-viewer/image-viewer.wxml
+++ b/src/image-viewer/image-viewer.wxml
@@ -2,7 +2,12 @@
 <wxs src="../common/utils.wxs" module="_" />
 
 <view wx:if="{{visible}}" id="{{classPrefix}}" class="{{classPrefix}} {{prefix}}-class">
-  <view class="{{classPrefix}}__mask" style="{{ 'background-color: ' + backgroundColor }}" />
+  <view
+    class="{{classPrefix}}__mask"
+    data-source="overlay"
+    bind:tap="onClose"
+    style="{{ 'background-color: ' + backgroundColor }}"
+  />
   <block wx:if="{{images && images.length}}">
     <view slot="content" class="{{classPrefix}}__content">
       <swiper
@@ -12,13 +17,7 @@
         current="{{currentSwiperIndex}}"
         bindchange="onSwiperChange"
       >
-        <swiper-item
-          wx:for="{{images}}"
-          wx:key="index"
-          class="{{classPrefix}}__preview-image"
-          data-source="overlay"
-          bind:tap="onClose"
-        >
+        <swiper-item wx:for="{{images}}" wx:key="index" class="{{classPrefix}}__preview-image">
           <t-image
             t-class="t-image--external"
             style="{{imagesShape[index].style}}"
@@ -33,26 +32,18 @@
       </swiper>
     </view>
     <view class="{{classPrefix}}__nav">
-      <view
-        wx:if="{{closeBtnName || _.isNoEmptyObj(closeBtnData)}}"
-        class="{{classPrefix}}__nav-close"
-        bind:tap="onClose"
-      >
-        <slot wx:if="{{closeBtnName === 'slot'}}" name="close-btn" />
-        <template wx:else is="icon" data="{{ name: closeBtnName, ...closeBtnData}}"></template>
+      <view class="{{classPrefix}}__nav-close" catch:tap="onClose">
+        <slot name="close-btn" />
+        <template wx:if="{{_closeBtn}}" is="icon" data="{{ ..._closeBtn }}" />
       </view>
 
       <view wx:if="{{showIndex}}" class="{{classPrefix}}__nav-index">
         {{currentSwiperIndex + 1}}/{{images.length}}
       </view>
 
-      <view
-        wx:if="{{deleteBtnName || _.isNoEmptyObj(deleteBtnData)}}"
-        class="{{classPrefix}}__nav-delete"
-        bind:tap="onDelete"
-      >
-        <slot wx:if="{{deleteBtnName === 'slot'}}" name="delete-btn" />
-        <template wx:else is="icon" data="{{ name: deleteBtnName, ...deleteBtnData}}"></template>
+      <view class="{{classPrefix}}__nav-delete" bind:tap="onDelete">
+        <slot name="delete-btn" />
+        <template is="icon" data="{{ ..._deleteBtn }}" />
       </view>
     </view>
   </block>