feat(imagepreview): use nutui image (#2793)

* fix: imagepreview use nutui image

* chore: console deps components

---------

Co-authored-by: oasis <[email protected]>

Author: xiaoyatong

packages/nutui-taro-demo/src/pages/index/index.tsx

@@ -1,5 +1,5 @@
 import Taro from '@tarojs/taro'
-import { View, Image, Text, ScrollView, Button, Input, Video } from '@tarojs/components'
+import { View, Image, Swiper, SwiperItem, Text, ScrollView, Button, Input, Video } from '@tarojs/components'
 import pkg from '@/packages/../config.json'
 import packageJson from '@/packages/../../package.json'
 import './index.scss'
@@ -10,7 +10,7 @@ const navs = pkg.nav
 
 
 // hack taro load button xml
-console.log(Button, Input, Video )
+console.log(Button, Input, Video,Image, Swiper, SwiperItem,  )
 
 // try {
 //     console.log('xxx', Schema)

src/packages/imagepreview/imagepreview.scss

@@ -77,6 +77,13 @@
       justify-content: center;
       height: 100%;
 
+      .nut-image,
+      .nut-video {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+
       .nut-image-preview-box {
         width: 100%;
       }

src/packages/imagepreview/imagepreview.taro.tsx

@@ -7,15 +7,11 @@ import React, {
   ReactNode,
 } from 'react'
 import Taro from '@tarojs/taro'
-import {
-  ITouchEvent,
-  Video as TaroVideo,
-  Image,
-  View,
-} from '@tarojs/components'
+import { ITouchEvent, Video as TaroVideo, View } from '@tarojs/components'
 import classNames from 'classnames'
 import { Close } from '@nutui/icons-react-taro'
 import Popup from '@/packages/popup/index.taro'
+import Image from '@/packages/image/index.taro'
 import Swiper from '@/packages/swiper/index.taro'
 import SwiperItem from '@/packages/swiperitem/index.taro'
 
@@ -342,7 +338,6 @@ export const ImagePreview: FunctionComponent<Partial<ImagePreviewProps>> = (
                     key={index}
                     className="nut-imagepreview-swiper-item"
                   >
-                    (
                     <Image
                       src={src}
                       mode="widthFix"
@@ -352,7 +347,6 @@ export const ImagePreview: FunctionComponent<Partial<ImagePreviewProps>> = (
                         showMenuByLongpress,
                       })}
                     />
-                    )
                   </SwiperItem>
                 )
               }