fix: hoverbutton h5 border is lost

src/packages/hoverbutton/demo.taro.tsx

@@ -8,11 +8,9 @@ import Demo1 from './demos/taro/demo1'
 import Demo2 from './demos/taro/demo2'
 import Demo3 from './demos/taro/demo3'
 import Demo4 from './demos/taro/demo4'
+import Demo5 from './demos/taro/demo5'
 import Demo6 from './demos/taro/demo6'
 import { harmony } from '@/utils/platform-taro'
-import Demo5 from './demos/taro/demo5'
-
-const isNative = harmony()
 
 const HoverDemo = () => {
   const [translated] = useTranslate({
@@ -51,7 +49,7 @@ const HoverDemo = () => {
       <Header />
       <ScrollView
         className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}
-        style={isNative ? { minHeight: 420 } : {}}
+        style={harmony() ? { minHeight: 420 } : {}}
       >
         <View className="h2">{translated.basic}</View>
         <Cell

src/packages/hoverbutton/demo.tsx

@@ -41,62 +41,60 @@ const HoverButtonDemo = () => {
   const [curDemo, setCurDemo] = useState('customNode')
 
   return (
-    <>
-      <div className="demo" style={{ paddingBottom: '100px' }}>
-        <h2>{translated.basic}</h2>
-        <Cell
-          title={`${translated.show}${translated.basic}`}
-          onClick={() => {
-            setCurDemo('basic')
-          }}
-        />
-        {curDemo === 'basic' && <Demo1 />}
+    <div className="demo" style={{ paddingBottom: '100px' }}>
+      <h2>{translated.basic}</h2>
+      <Cell
+        title={`${translated.show}${translated.basic}`}
+        onClick={() => {
+          setCurDemo('basic')
+        }}
+      />
+      {curDemo === 'basic' && <Demo1 />}
 
-        <h2>{translated.multiButtons}</h2>
-        <Cell
-          title={`${translated.show}${translated.multiButtons}`}
-          onClick={() => {
-            setCurDemo('multiButtons')
-          }}
-        />
-        {curDemo === 'multiButtons' && <Demo2 />}
+      <h2>{translated.multiButtons}</h2>
+      <Cell
+        title={`${translated.show}${translated.multiButtons}`}
+        onClick={() => {
+          setCurDemo('multiButtons')
+        }}
+      />
+      {curDemo === 'multiButtons' && <Demo2 />}
 
-        <h2>{translated.hasTabbar}</h2>
-        <Cell
-          title={`${translated.show}${translated.hasTabbar}`}
-          onClick={() => {
-            setCurDemo('hasTabbar')
-          }}
-        />
-        {curDemo === 'hasTabbar' && <Demo3 />}
+      <h2>{translated.hasTabbar}</h2>
+      <Cell
+        title={`${translated.show}${translated.hasTabbar}`}
+        onClick={() => {
+          setCurDemo('hasTabbar')
+        }}
+      />
+      {curDemo === 'hasTabbar' && <Demo3 />}
 
-        <h2>{translated.customZIndex}</h2>
-        <Cell
-          title={`${translated.show}${translated.customZIndex}`}
-          onClick={() => {
-            setCurDemo('customZIndex')
-          }}
-        />
-        {curDemo === 'customZIndex' && <Demo4 />}
+      <h2>{translated.customZIndex}</h2>
+      <Cell
+        title={`${translated.show}${translated.customZIndex}`}
+        onClick={() => {
+          setCurDemo('customZIndex')
+        }}
+      />
+      {curDemo === 'customZIndex' && <Demo4 />}
 
-        <h2>{translated.customSpacing}</h2>
-        <Cell
-          title={`${translated.show}${translated.customSpacing}`}
-          onClick={() => {
-            setCurDemo('customSpacing')
-          }}
-        />
-        {curDemo === 'customSpacing' && <Demo5 />}
-        <h2>{translated.customNode}</h2>
-        <Cell
-          title={`${translated.show}${translated.customNode}`}
-          onClick={() => {
-            setCurDemo('customNode')
-          }}
-        />
-        {curDemo === 'customNode' && <Demo6 />}
-      </div>
-    </>
+      <h2>{translated.customSpacing}</h2>
+      <Cell
+        title={`${translated.show}${translated.customSpacing}`}
+        onClick={() => {
+          setCurDemo('customSpacing')
+        }}
+      />
+      {curDemo === 'customSpacing' && <Demo5 />}
+      <h2>{translated.customNode}</h2>
+      <Cell
+        title={`${translated.show}${translated.customNode}`}
+        onClick={() => {
+          setCurDemo('customNode')
+        }}
+      />
+      {curDemo === 'customNode' && <Demo6 />}
+    </div>
   )
 }
 

src/packages/hoverbutton/demos/h5/demo1.tsx

@@ -1,6 +1,3 @@
-/**
- * 基础用法
- */
 import React from 'react'
 import { HoverButton, Toast } from '@nutui/nutui-react'
 import { Cart } from '@nutui/icons-react'

src/packages/hoverbutton/demos/h5/demo2.tsx

@@ -1,6 +1,3 @@
-/**
- * 多个按钮
- */
 import React from 'react'
 import { HoverButton, Toast } from '@nutui/nutui-react'
 import { Cart } from '@nutui/icons-react'

src/packages/hoverbutton/demos/h5/demo3.tsx

@@ -1,6 +1,3 @@
-/**
- * 有底部导航栏的情况
- */
 import React from 'react'
 import { HoverButton } from '@nutui/nutui-react'
 import { Cart } from '@nutui/icons-react'

src/packages/hoverbutton/demos/h5/demo4.tsx

@@ -1,6 +1,3 @@
-/**
- * 自定义层级
- */
 import React from 'react'
 import { HoverButton, SafeArea } from '@nutui/nutui-react'
 import { Cart } from '@nutui/icons-react'

src/packages/hoverbutton/demos/h5/demo6.tsx

@@ -1,53 +1,48 @@
-/**
- * 基础用法
- */
 import React from 'react'
 import { HoverButton } from '@nutui/nutui-react'
 
 const Demo1 = () => {
   return (
-    <>
-      <HoverButton>
+    <HoverButton>
+      <div
+        className="nut-hoverbutton-item-container"
+        style={{
+          display: 'flex',
+          flexDirection: 'column',
+          alignItems: 'center',
+        }}
+      >
+        <span
+          style={{
+            fontSize: 12,
+            fontWeight: 700,
+            lineHeight: 1,
+            marginTop: 5,
+            fontFamily: 'JD',
+          }}
+        >
+          3
+        </span>
+        <div
+          style={{
+            height: 1,
+            width: 20,
+            background: '#1A1A1A',
+            marginTop: 3,
+            marginBottom: 3,
+          }}
+        />
         <div
-          className="nut-hoverbutton-item-container"
           style={{
-            display: 'flex',
-            flexDirection: 'column',
-            alignItems: 'center',
+            fontSize: 10,
+            lineHeight: '9px',
+            fontFamily: 'JD',
           }}
         >
-          <span
-            style={{
-              fontSize: 12,
-              fontWeight: 700,
-              lineHeight: 1,
-              marginTop: 5,
-              fontFamily: 'JD',
-            }}
-          >
-            3
-          </span>
-          <div
-            style={{
-              height: 1,
-              width: 20,
-              background: '#1A1A1A',
-              marginTop: 3,
-              marginBottom: 3,
-            }}
-          />
-          <div
-            style={{
-              fontSize: 10,
-              lineHeight: '9px',
-              fontFamily: 'JD',
-            }}
-          >
-            238
-          </div>
+          238
         </div>
-      </HoverButton>
-    </>
+      </div>
+    </HoverButton>
   )
 }
 export default Demo1

src/packages/hoverbutton/demos/taro/demo1.tsx

@@ -1,6 +1,3 @@
-/**
- * 基础用法
- */
 import React from 'react'
 import { HoverButton } from '@nutui/nutui-react-taro'
 import { ITouchEvent } from '@tarojs/components'

src/packages/hoverbutton/demos/taro/demo2.tsx

@@ -1,6 +1,3 @@
-/**
- * 多个按钮
- */
 import React from 'react'
 import { HoverButton } from '@nutui/nutui-react-taro'
 import { Cart } from '@nutui/icons-react-taro'

src/packages/hoverbutton/demos/taro/demo3.tsx

@@ -1,6 +1,3 @@
-/**
- * 有底部导航栏的情况
- */
 import React from 'react'
 import { HoverButton, Tabbar } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'

src/packages/hoverbutton/demos/taro/demo4.tsx

@@ -1,6 +1,3 @@
-/**
- * 自定义层级
- */
 import React from 'react'
 import { HoverButton } from '@nutui/nutui-react-taro'
 import { View, Text } from '@tarojs/components'

src/packages/hoverbutton/demos/taro/demo6.tsx

@@ -1,54 +1,50 @@
-/**
- * 基础用法
- */
 import React from 'react'
 import { HoverButton } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
 
 const Demo1 = () => {
   return (
-    <>
-      <HoverButton>
+    <HoverButton>
+      <View
+        className="nut-hoverbutton-item nut-hoverbutton-item-container"
+        style={{
+          display: 'flex',
+          flexDirection: 'column',
+          alignItems: 'center',
+          marginBottom: 8,
+        }}
+      >
         <View
-          className="nut-hoverbutton-item nut-hoverbutton-item-container"
           style={{
-            display: 'flex',
-            flexDirection: 'column',
-            alignItems: 'center',
-            marginBottom: 8,
+            fontSize: 12,
+            fontWeight: 700,
+            lineHeight: 1,
+            marginTop: 5,
+            fontFamily: 'JD',
           }}
         >
-          <View
-            style={{
-              fontSize: 12,
-              fontWeight: 700,
-              lineHeight: 1,
-              marginTop: 5,
-              fontFamily: 'JD',
-            }}
-          >
-            3
-          </View>
-          <View
-            style={{
-              height: 1,
-              width: 20,
-              background: '#1A1A1A',
-              marginTop: 3,
-              marginBottom: 3,
-            }}
-          />
-          <View
-            style={{
-              fontSize: 10,
-              fontFamily: 'JD',
-            }}
-          >
-            238
-          </View>
+          3
         </View>
-      </HoverButton>
-    </>
+        <View
+          style={{
+            borderTopWidth: 1,
+            borderTopColor: '#1a1a1a',
+            borderTopStyle: 'solid',
+            width: 20,
+            marginTop: 3,
+            marginBottom: 3,
+          }}
+        />
+        <View
+          style={{
+            fontSize: 10,
+            fontFamily: 'JD',
+          }}
+        >
+          238
+        </View>
+      </View>
+    </HoverButton>
   )
 }
 export default Demo1