From 6e5f215140a123e47646aed5295fd2fedca7e3c6 Mon Sep 17 00:00:00 2001
From: chenjiahan <chenjiahan@youzan.com>
Date: Tue, 7 Sep 2021 11:19:47 +0800
Subject: [PATCH] docs(ImagePreview): fix warning

---
 .../vant/src/image-preview/demo/index.vue     | 44 +++++++++++--------
 .../vant/src/image-preview/function-call.tsx  |  6 ++-
 2 files changed, 29 insertions(+), 21 deletions(-)

diff --git a/packages/vant/src/image-preview/demo/index.vue b/packages/vant/src/image-preview/demo/index.vue
index 8e0a7b0dc..749944a7b 100644
--- a/packages/vant/src/image-preview/demo/index.vue
+++ b/packages/vant/src/image-preview/demo/index.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
 import VanCell from '../../cell';
-import VanImagePreview, { ImagePreview, ImagePreviewOptions } from '..';
+import { ImagePreview, ImagePreviewOptions } from '..';
 import { ref } from 'vue';
 import { useTranslate } from '../../../docs/site/use-translate';
 import { Toast } from '../../toast';
 
+const VanImagePreview = ImagePreview.Component;
+
 const t = useTranslate({
   'zh-CN': {
     closed: '关闭',
@@ -73,33 +75,37 @@ const showImagePreview = (options: Partial<ImagePreviewOptions> = {}) => {
 
 <template>
   <demo-block card :title="t('basicUsage')">
-    <van-cell is-link @click="showImagePreview()">
-      {{ t('showImages') }}
-    </van-cell>
+    <van-cell is-link :value="t('showImages')" @click="showImagePreview()" />
   </demo-block>
 
   <demo-block card :title="t('customConfig')">
-    <van-cell is-link @click="showImagePreview({ startPosition: 1 })">
-      {{ t('startPosition') }}
-    </van-cell>
-    <van-cell is-link @click="showImagePreview({ closeable: true })">
-      {{ t('showClose') }}
-    </van-cell>
-    <van-cell is-link @click="showImagePreview({ onClose })">
-      {{ t('closeEvent') }}
-    </van-cell>
+    <van-cell
+      is-link
+      :value="t('startPosition')"
+      @click="showImagePreview({ startPosition: 1 })"
+    />
+    <van-cell
+      is-link
+      :value="t('showClose')"
+      @click="showImagePreview({ closeable: true })"
+    />
+    <van-cell
+      is-link
+      :value="t('closeEvent')"
+      @click="showImagePreview({ onClose })"
+    />
   </demo-block>
 
   <demo-block card :title="t('beforeClose')">
-    <van-cell is-link @click="showImagePreview({ beforeClose })">
-      {{ t('beforeClose') }}
-    </van-cell>
+    <van-cell
+      is-link
+      :value="t('beforeClose')"
+      @click="showImagePreview({ beforeClose })"
+    />
   </demo-block>
 
   <demo-block card :title="t('componentCall')">
-    <van-cell is-link @click="showComponentCall">
-      {{ t('componentCall') }}
-    </van-cell>
+    <van-cell is-link :value="t('componentCall')" @click="showComponentCall" />
     <van-image-preview v-model:show="show" :images="images" @change="onChange">
       <template #index>{{ t('index', index) }}</template>
     </van-image-preview>
diff --git a/packages/vant/src/image-preview/function-call.tsx b/packages/vant/src/image-preview/function-call.tsx
index c3d6515b6..13c4624df 100644
--- a/packages/vant/src/image-preview/function-call.tsx
+++ b/packages/vant/src/image-preview/function-call.tsx
@@ -51,7 +51,7 @@ function initInstance() {
 }
 
 const ImagePreview = (
-  images: string[] | ImagePreviewOptions,
+  options: string[] | ImagePreviewOptions,
   startPosition = 0
 ) => {
   /* istanbul ignore if */
@@ -63,7 +63,9 @@ const ImagePreview = (
     initInstance();
   }
 
-  const options = Array.isArray(images) ? { images, startPosition } : images;
+  options = Array.isArray(options)
+    ? { images: options, startPosition }
+    : options;
 
   instance.open(extend({}, defaultConfig, options));