diff --git a/src/packages/hoverbutton/demo.taro.tsx b/src/packages/hoverbutton/demo.taro.tsx
index c35a68daf0..c94eddc4e5 100644
--- a/src/packages/hoverbutton/demo.taro.tsx
+++ b/src/packages/hoverbutton/demo.taro.tsx
@@ -5,13 +5,9 @@ import { Cell } from '@nutui/nutui-react-taro'
 import { useTranslate } from '@/sites/assets/locale/taro'
 import Header from '@/sites/components/header'
 import Demo1 from './demos/taro/demo1'
-import Demo1Rn from './demos/taro/demo1-rn'
 import Demo2 from './demos/taro/demo2'
-import Demo2Rn from './demos/taro/demo2-rn'
 import Demo3 from './demos/taro/demo3'
-import Demo3Rn from './demos/taro/demo3-rn'
 import Demo4 from './demos/taro/demo4'
-import Demo4Rn from './demos/taro/demo4-rn'
 import { harmonyAndRn } from '@/utils/platform-taro'
 // import Demo5 from './demos/taro/demo5'
 
@@ -97,10 +93,10 @@ const HoverDemo = () => {
         )} */}
       </ScrollView>
 
-      {curDemo === 'basic' && (isNative ? <Demo1Rn /> : <Demo1 />)}
-      {curDemo === 'multiButtons' && (isNative ? <Demo2Rn /> : <Demo2 />)}
-      {curDemo === 'hasTabbar' && (isNative ? <Demo3Rn /> : <Demo3 />)}
-      {curDemo === 'customZIndex' && (isNative ? <Demo4Rn /> : <Demo4 />)}
+      {curDemo === 'basic' && <Demo1 />}
+      {curDemo === 'multiButtons' && <Demo2 />}
+      {curDemo === 'hasTabbar' && <Demo3 />}
+      {curDemo === 'customZIndex' && <Demo4 />}
       {/* {curDemo === 'customSpacing' && <Demo5 />} */}
     </View>
   )
diff --git a/src/packages/hoverbutton/demos/taro/demo1-rn.tsx b/src/packages/hoverbutton/demos/taro/demo1-rn.tsx
deleted file mode 100644
index 0894a8b292..0000000000
--- a/src/packages/hoverbutton/demos/taro/demo1-rn.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-/**
- * 基础用法
- */
-import React from 'react'
-import { HoverButton } from '@nutui/nutui-react-taro'
-import { ITouchEvent, View, Icon } from '@tarojs/components'
-// @TODO Icon 暂未适配 rn、鸿蒙端
-// import { Cart } from '@nutui/icons-react-taro'
-
-const Demo1 = () => {
-  const testClick = (
-    event: React.MouseEvent<HTMLDivElement, MouseEvent> | ITouchEvent
-  ) => {
-    console.log('点击事件')
-  }
-
-  return (
-    <View>
-      <HoverButton icon={<Icon type="search" />} onClick={testClick} />
-    </View>
-  )
-}
-export default Demo1
diff --git a/src/packages/hoverbutton/demos/taro/demo2-rn.tsx b/src/packages/hoverbutton/demos/taro/demo2-rn.tsx
deleted file mode 100644
index 2713c592df..0000000000
--- a/src/packages/hoverbutton/demos/taro/demo2-rn.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-/**
- * 多个按钮
- */
-import React from 'react'
-import { HoverButton } from '@nutui/nutui-react-taro'
-// import { Cart } from '@nutui/icons-react-taro'
-import { Icon } from '@tarojs/components'
-
-const Demo2 = () => {
-  const testClick1 = () => {
-    console.log('点击了第 1 个按钮')
-  }
-  const testClick2 = () => {
-    console.log('点击了第 2 个按钮')
-  }
-  const testClick3 = () => {
-    console.log('点击了第 3 个按钮')
-  }
-
-  return (
-    <HoverButton>
-      <HoverButton.Item icon={<Icon type="search" />} onClick={testClick1} />
-      <HoverButton.Item icon={<Icon type="search" />} onClick={testClick2} />
-      <HoverButton.Item icon={<Icon type="search" />} onClick={testClick3} />
-    </HoverButton>
-  )
-}
-export default Demo2
diff --git a/src/packages/hoverbutton/demos/taro/demo3-rn.tsx b/src/packages/hoverbutton/demos/taro/demo3-rn.tsx
deleted file mode 100644
index 30fe990c82..0000000000
--- a/src/packages/hoverbutton/demos/taro/demo3-rn.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-/**
- * 有底部导航栏的情况
- */
-import React from 'react'
-// import { HoverButton, Tabbar } from '@nutui/nutui-react-taro'
-import { HoverButton } from '@nutui/nutui-react-taro'
-import { View, Icon } from '@tarojs/components'
-// import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro'
-
-const Demo3 = () => {
-  return (
-    <View>
-      <HoverButton icon={<Icon type="search" />} tabbarHeight={48} />
-      {/* {process.env.TARO_ENV !== 'rn' && process.env.TARO_ENV !== 'jdrn' && ( */}
-      {/*  <Tabbar fixed> */}
-      {/*    <Tabbar.Item title="首页" icon={<Home size={18} />} /> */}
-      {/*    <Tabbar.Item title="分类" icon={<Category size={18} />} /> */}
-      {/*    <Tabbar.Item title="发现" icon={<Find size={18} />} /> */}
-      {/*    <Tabbar.Item title="购物车" icon={<Cart size={18} />} /> */}
-      {/*    <Tabbar.Item title="我的" icon={<User size={18} />} /> */}
-      {/*  </Tabbar> */}
-      {/* )} */}
-    </View>
-  )
-}
-export default Demo3
diff --git a/src/packages/hoverbutton/demos/taro/demo3.tsx b/src/packages/hoverbutton/demos/taro/demo3.tsx
index fce218b0a4..ad71b59799 100644
--- a/src/packages/hoverbutton/demos/taro/demo3.tsx
+++ b/src/packages/hoverbutton/demos/taro/demo3.tsx
@@ -2,24 +2,24 @@
  * 有底部导航栏的情况
  */
 import React from 'react'
-// import { HoverButton, Tabbar } from '@nutui/nutui-react-taro'
-// import { HoverButton } from '@nutui/nutui-react-taro'
+import { HoverButton, Tabbar } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
-// import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro'
+import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro'
+import { harmonyAndRn } from '@/utils/platform-taro'
 
 const Demo3 = () => {
   return (
     <View>
-      {/* <HoverButton icon={<Cart />} tabbarHeight={48} /> */}
-      {/* {process.env.TARO_ENV !== 'rn' && process.env.TARO_ENV !== 'jdrn' && ( */}
-      {/*  <Tabbar fixed> */}
-      {/*    <Tabbar.Item title="首页" icon={<Home size={18} />} /> */}
-      {/*    <Tabbar.Item title="分类" icon={<Category size={18} />} /> */}
-      {/*    <Tabbar.Item title="发现" icon={<Find size={18} />} /> */}
-      {/*    <Tabbar.Item title="购物车" icon={<Cart size={18} />} /> */}
-      {/*    <Tabbar.Item title="我的" icon={<User size={18} />} /> */}
-      {/*  </Tabbar> */}
-      {/* )} */}
+      <HoverButton icon={<Cart />} tabbarHeight={48} />
+      {harmonyAndRn() ? null : (
+        <Tabbar fixed>
+          <Tabbar.Item title="首页" icon={<Home size={18} />} />
+          <Tabbar.Item title="分类" icon={<Category size={18} />} />
+          <Tabbar.Item title="发现" icon={<Find size={18} />} />
+          <Tabbar.Item title="购物车" icon={<Cart size={18} />} />
+          <Tabbar.Item title="我的" icon={<User size={18} />} />
+        </Tabbar>
+      )}
     </View>
   )
 }
diff --git a/src/packages/hoverbutton/demos/taro/demo4-rn.tsx b/src/packages/hoverbutton/demos/taro/demo4-rn.tsx
deleted file mode 100644
index d566bc3e42..0000000000
--- a/src/packages/hoverbutton/demos/taro/demo4-rn.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-/**
- * 自定义层级
- */
-import React from 'react'
-// import { HoverButton, SafeArea } from '@nutui/nutui-react-taro'
-import { HoverButton } from '@nutui/nutui-react-taro'
-import { View, Icon, Text } from '@tarojs/components'
-// import { Cart } from '@nutui/icons-react-taro'
-import Taro, { pxTransform } from '@tarojs/taro'
-
-const App = () => {
-  return (
-    <View>
-      <HoverButton icon={<Icon type="search" />} zIndex={101} />
-      <View
-        style={{
-          zIndex: 100,
-          position: Taro.getEnv() === 'RN' ? 'absolute' : 'fixed',
-          width: '100%',
-          left: 0,
-          bottom: 0,
-          backgroundColor: 'rgba(0, 0, 0, 0.5)',
-        }}
-      >
-        <Text
-          style={{
-            height: pxTransform(60),
-            textAlign: 'center',
-            color: '#FFFFFF',
-          }}
-        >
-          这个图层层级为 100
-        </Text>
-        {/* <SafeArea position="bottom" /> */}
-      </View>
-    </View>
-  )
-}
-export default App
diff --git a/src/packages/hoverbutton/demos/taro/demo4.tsx b/src/packages/hoverbutton/demos/taro/demo4.tsx
index dfb6d0a909..ff73546357 100644
--- a/src/packages/hoverbutton/demos/taro/demo4.tsx
+++ b/src/packages/hoverbutton/demos/taro/demo4.tsx
@@ -2,9 +2,8 @@
  * 自定义层级
  */
 import React from 'react'
-// import { HoverButton, SafeArea } from '@nutui/nutui-react-taro'
 import { HoverButton } from '@nutui/nutui-react-taro'
-import { View } from '@tarojs/components'
+import { View, Text } from '@tarojs/components'
 import { Cart } from '@nutui/icons-react-taro'
 import Taro, { pxTransform } from '@tarojs/taro'
 
@@ -25,11 +24,12 @@ const App = () => {
         <View
           style={{
             height: pxTransform(60),
-            textAlign: 'center',
+            display: 'flex',
+            justifyContent: 'center',
             color: '#FFFFFF',
           }}
         >
-          这个图层层级为 100
+          <Text style={{ color: '#FFFFFF' }}>这个图层层级为 1000</Text>
         </View>
         {/* <SafeArea position="bottom" /> */}
       </View>