feat: 修改taro 实现下的div标签等

jdf2e · Jul 22, 2024 · 830366d · 830366d
1 parent cf4e118
commit 830366d
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 38 deletions.
diff --git a/src/packages/datepicker/demo.taro.tsx b/src/packages/datepicker/demo.taro.tsx
@@ -1,5 +1,6 @@
 import React from 'react'
 import Taro from '@tarojs/taro'
+import { ScrollView, View } from '@tarojs/components'
 import Header from '@/sites/components/header'
 import { useTranslate } from '@/sites/assets/locale/taro'
 import Demo1 from './demos/taro/demo1'
@@ -48,24 +49,24 @@ const DatePickerDemo = () => {
   return (
     <>
       <Header />
-      <div className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}>
-        <h2>{translated.basic}</h2>
+      <ScrollView className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}>
+        <View className="h2">{translated.basic}</View>
         <Demo1 />
-        <h2>{translated.mmdd}</h2>
+        <View className="h2">{translated.mmdd}</View>
         <Demo2 />
-        <h2>{translated.showAll}</h2>
+        <View className="h2">{translated.showAll}</View>
         <Demo3 />
-        <h2>{translated.time}</h2>
+        <View className="h2">{translated.time}</View>
         <Demo4 />
-        <h2>{translated.hourMinutes}</h2>
+        <View className="h2">{translated.hourMinutes}</View>
         <Demo5 />
-        <h2>{translated.format}</h2>
+        <View className="h2">{translated.format}</View>
         <Demo6 />
-        <h2>{translated.stepMins}</h2>
+        <View className="h2">{translated.stepMins}</View>
         <Demo7 />
-        <h2>{translated.filter}</h2>
+        <View className="h2">{translated.filter}</View>
         <Demo8 />
-      </div>
+      </ScrollView>
     </>
   )
 }

diff --git a/src/packages/imagepreview/imagepreview.taro.tsx b/src/packages/imagepreview/imagepreview.taro.tsx
@@ -7,7 +7,12 @@ import React, {
   ReactNode,
 } from 'react'
 import Taro from '@tarojs/taro'
-import { ITouchEvent, Video as TaroVideo, Image } from '@tarojs/components'
+import {
+  ITouchEvent,
+  Video as TaroVideo,
+  Image,
+  View,
+} from '@tarojs/components'
 import classNames from 'classnames'
 import { Close } from '@nutui/icons-react-taro'
 import Popup from '@/packages/popup/index.taro'
@@ -271,7 +276,7 @@ export const ImagePreview: FunctionComponent<Partial<ImagePreviewProps>> = (
       style={{ width: '100%' }}
       onClick={onCloseInner}
     >
-      <div
+      <View
         className={classNames(classPrefix, className)}
         style={style}
         ref={ref}
@@ -320,7 +325,6 @@ export const ImagePreview: FunctionComponent<Partial<ImagePreviewProps>> = (
                       key={index}
                       className="nut-imagepreview-swiper-item"
                     >
-                      (
                       <Image
                         src={item.src}
                         mode="widthFix"
@@ -330,26 +334,25 @@ export const ImagePreview: FunctionComponent<Partial<ImagePreviewProps>> = (
                           showMenuByLongpress,
                         })}
                       />
-                      )
                     </SwiperItem>
                   )
                 })
               : []
           )}
         </Swiper>
-      </div>
+      </View>
       {pagination ? (
-        <div className={`${classPrefix}-index`}>
+        <View className={`${classPrefix}-index`}>
           {active}/{(images ? images.length : 0) + (videos ? videos.length : 0)}
-        </div>
+        </View>
       ) : null}
       {closeIcon !== false ? (
-        <div
+        <View
           className={`${classPrefix}-close ${closeIconPosition}`}
           onClick={onCloseInner}
         >
           {closeIcon === true ? <Close /> : closeIcon}
-        </div>
+        </View>
       ) : null}
     </Popup>
   )

diff --git a/src/packages/picker/demo.taro.tsx b/src/packages/picker/demo.taro.tsx
@@ -1,5 +1,6 @@
 import React from 'react'
 import Taro from '@tarojs/taro'
+import { ScrollView, View } from '@tarojs/components'
 import { useTranslate } from '@/sites/assets/locale/taro'
 import Header from '@/sites/components/header'
 import Demo1 from './demos/taro/demo1'
@@ -48,24 +49,24 @@ const PickerDemo = () => {
   return (
     <>
       <Header />
-      <div className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}>
-        <h2>{translated.basic}</h2>
+      <ScrollView className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}>
+        <View className="h2">{translated.basic}</View>
         <Demo1 />
-        <h2>{translated.defaultSelected}</h2>
+        <View className="h2">{translated.defaultSelected}</View>
         <Demo2 />
-        <h2>{translated.controlled}</h2>
+        <View className="h2">{translated.controlled}</View>
         <Demo3 />
-        <h2>{translated.multipleColumns}</h2>
+        <View className="h2">{translated.multipleColumns}</View>
         <Demo4 />
-        <h2>{translated.tileDesc}</h2>
+        <View className="h2">{translated.tileDesc}</View>
         <Demo5 />
-        <h2>{translated.cascade}</h2>
+        <View className="h2">{translated.cascade}</View>
         <Demo6 />
-        <h2>{translated.async}</h2>
+        <View className="h2">{translated.async}</View>
         <Demo7 />
-        <h2>{translated.theme}</h2>
+        <View className="h2">{translated.theme}</View>
         <Demo8 />
-      </div>
+      </ScrollView>
     </>
   )
 }

diff --git a/src/packages/picker/picker.taro.tsx b/src/packages/picker/picker.taro.tsx
@@ -315,8 +315,8 @@ const InternalPicker: ForwardRefRenderFunction<
 
   const renderTitleBar = () => {
     return (
-      <div className={`${classPrefix}-control`}>
-        <span
+      <View className={`${classPrefix}-control`}>
+        <View
           className={`${classPrefix}-cancel-btn`}
           onClick={(e) => {
             e.stopPropagation()
@@ -325,18 +325,18 @@ const InternalPicker: ForwardRefRenderFunction<
           }}
         >
           {locale?.cancel}
-        </span>
-        <div className={`${classPrefix}-title`}>{title || ''}</div>
-        <span
+        </View>
+        <View className={`${classPrefix}-title`}>{title || ''}</View>
+        <View
           className={`${classPrefix}-confirm-btn`}
           onClick={(e) => {
             e.stopPropagation()
             confirm()
           }}
         >
           {locale.confirm}
-        </span>
-      </div>
+        </View>
+      </View>
     )
   }
 
@@ -389,7 +389,7 @@ const InternalPicker: ForwardRefRenderFunction<
         <View className={classes} style={style} {...rest} catchMove>
           {renderTitleBar()}
           {typeof children !== 'function' && children}
-          <div className={`${classPrefix}-panel`} ref={pickerRef}>
+          <View className={`${classPrefix}-panel`} ref={pickerRef}>
             {Taro.getEnv() === 'WEB' ? (
               columnsList?.map((item, index) => {
                 return (
@@ -437,7 +437,7 @@ const InternalPicker: ForwardRefRenderFunction<
                 })}
               </PickerView>
             )}
-          </div>
+          </View>
         </View>
       </Popup>
     </>