jdf2e · oasis-cloud · Jan 8, 2025 · Jan 7, 2025 · Jan 7, 2025 · Jan 8, 2025
diff --git a/index.html b/index.html
@@ -1,14 +1,20 @@
 <!DOCTYPE html>
 <html lang="en">
-
 <head>
   <meta charset="utf-8" />
+  <title>NutUI - 移动端React组件库</title>
   <meta content="telephone=no" name="format-detection" />
+  <link rel="dns-prefetch" href="//wl.jd.com">
+  <link rel="dns-prefetch" href="//h5.m.jd.com">
+  <link rel="dns-prefetch" href="//img14.360buyimg.com">
+  <link rel="dns-prefetch" href="//img10.360buyimg.com">
+  <link rel="dns-prefetch" href="//mercury.jd.com">
+  <link rel="dns-prefetch" href="//stream-outside.jd.com">
+  <link rel="dns-prefetch" href="//static.hotjar.com">
   <link rel="shortcut icon"
-    href="https://img14.360buyimg.com/imagetools/jfs/t1/167902/2/8762/791358/603742d7E9b4275e3/e09d8f9a8bf4c0ef.png" />
+    href="//img14.360buyimg.com/imagetools/jfs/t1/167902/2/8762/791358/603742d7E9b4275e3/e09d8f9a8bf4c0ef.png" />
   <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
-  <title>NutUI - 移动端React组件库</title>
-  <script src="https://h5.m.jd.com/babelDiy/Zeus/2846ykuM7PwipD9E2RzMj2BGEQpA/plugin/share.min.js"></script>
+  <script src="//h5.m.jd.com/babelDiy/Zeus/2846ykuM7PwipD9E2RzMj2BGEQpA/plugin/share.min.js"></script>
   <style>
     html {
       background: #f7f7f7;
@@ -32,7 +38,7 @@
       r.async = 1;
       r.src = t + h._hjSettings.hjid + j + h._hjSettings.hjsv;
       a.appendChild(r);
-    })(window, document, "https://static.hotjar.com/c/hotjar-", ".js?sv=");
+    })(window, document, "//static.hotjar.com/c/hotjar-", ".js?sv=");
   </script>
 </head>
 
@@ -43,7 +49,7 @@
       continue.</strong>
   </noscript>
   <div id="doc"></div>
-  <script type="module" src="./src/sites/doc/main.tsx"></script>
+  <script type="module" src="/src/sites/doc/main.tsx"></script>
   <script>
     //分享配置
     var shareOption = {
@@ -73,7 +79,7 @@
       s.parentNode.insertBefore(ja, s);
     })();
   </script>
-  <script type="text/javascript" src="https://s23.cnzz.com/z_stat.php?id=1276268086&web_id=1276268086"></script>
+  <script type="text/javascript" src="//s23.cnzz.com/z_stat.php?id=1276268086&web_id=1276268086"></script>
 </body>
 
 </html>
diff --git a/src/config.json b/src/config.json
@@ -142,7 +142,6 @@
           "version": "3.0.0",
           "name": "Image",
           "type": "component",
-          "tarodoc": true,
           "cName": "图片",
           "desc": "增强版的 img 标签，提供多种图片填充模式，支持图片加载中提示、加载失败提示。",
           "sort": 8,
@@ -296,7 +295,6 @@
           "cName": "返回顶部",
           "desc": "提供较长的页面快捷返回顶部功能。",
           "sort": 2,
-          "tarodoc": true,
           "show": true,
           "taro": true,
           "v15": true,
@@ -809,7 +807,6 @@
           "version": "3.0.0",
           "name": "Uploader",
           "type": "component",
-          "tarodoc": true,
           "cName": "上传",
           "desc": "用于将本地的图片或文件上传至服务器。",
           "sort": 1,
@@ -905,7 +902,6 @@
           "version": "3.0.0",
           "name": "InfiniteLoading",
           "type": "component",
-          "tarodoc": true,
           "cName": "滚动加载",
           "desc": "列表滚动到底部自动加载更多数据。",
           "sort": 5,
@@ -944,7 +940,6 @@
           "version": "3.0.0",
           "name": "Notify",
           "type": "component",
-          "tarodoc": true,
           "cName": "消息通知",
           "desc": "在页面顶部展示消息提示",
           "sort": 11,
@@ -1021,7 +1016,6 @@
           "version": "3.0.0",
           "name": "Toast",
           "type": "component",
-          "tarodoc": true,
           "cName": "吐司",
           "desc": "轻提示",
           "sort": 1,
@@ -1336,7 +1330,6 @@
           "name": "Video",
           "type": "component",
           "cName": "视频播放器",
-          "tarodoc": true,
           "desc": "原生video实现的视频播放器",
           "sort": 20,
           "show": true,
@@ -1351,7 +1344,6 @@
           "cName": "虚拟列表",
           "desc": "长列表渲染",
           "sort": 20,
-          "tarodoc": true,
           "show": true,
           "taro": true,
           "author": "hx",

diff --git a/src/packages/button/button.taro.tsx b/src/packages/button/button.taro.tsx
@@ -1,4 +1,4 @@
-import React, { CSSProperties, useCallback } from 'react'
+import React, { CSSProperties, useCallback, useMemo } from 'react'
 import type { MouseEvent } from 'react'
 import classNames from 'classnames'
 import {
@@ -46,7 +46,7 @@ export interface ButtonProps
 
 const prefixCls = 'nut-button'
 
-const defaultProps = {
+const defaultProps: Partial<ButtonProps> = {
   ...ComponentDefaults,
   color: '',
   type: 'default',
@@ -59,7 +59,7 @@ const defaultProps = {
   icon: null,
   rightIcon: null,
   onClick: (e: MouseEvent<HTMLButtonElement>) => {},
-} as ButtonProps
+}
 export const Button = React.forwardRef<HTMLButtonElement, Partial<ButtonProps>>(
   (props, ref) => {
     const {
@@ -79,11 +79,9 @@ export const Button = React.forwardRef<HTMLButtonElement, Partial<ButtonProps>>(
       nativeType,
       onClick,
       ...rest
-    } = {
-      ...defaultProps,
-      ...props,
-    }
-    const getStyle = useCallback(() => {
+    } = { ...defaultProps, ...props }
+
+    const getStyle = useMemo(() => {
       const style: CSSProperties = {}
       if (color) {
         if (props.fill === 'outline' || props.fill === 'dashed') {
@@ -103,7 +101,7 @@ export const Button = React.forwardRef<HTMLButtonElement, Partial<ButtonProps>>(
       return style
     }, [color, props.fill])
 
-    const getContStyle = useCallback(() => {
+    const getContStyle = useMemo(() => {
       const style: CSSProperties = {}
       if (props.color) {
         if (props.fill === 'outline' || props.fill === 'dashed') {
@@ -115,13 +113,37 @@ export const Button = React.forwardRef<HTMLButtonElement, Partial<ButtonProps>>(
         }
       }
       return style
-    }, [color])
+    }, [color, props.fill, props.color])
+
+    const handleClick = useCallback(
+      (e: MouseEvent<HTMLButtonElement>) => {
+        if (!loading && !disabled && onClick) {
+          onClick(e)
+        }
+      },
+      [loading, disabled, onClick]
+    )
+
+    const buttonClassNames = classNames(
+      prefixCls,
+      `${prefixCls}-${type}`,
+      {
+        [`${prefixCls}-${type}-solid`]: type === 'primary' && !props.fill,
+        [`${prefixCls}-${fill}`]: props.fill,
+        [`${prefixCls}-${type}-${fill}`]: props.fill,
+        [`${prefixCls}-${size}`]: size,
+        [`${prefixCls}-${shape}`]: shape,
+        [`${prefixCls}-${shape}-${size}`]: shape && size,
+        [`${prefixCls}-block`]: block,
+        [`${prefixCls}-disabled`]: disabled || loading,
+        [`${prefixCls}-${type}${props.fill ? `-${fill}` : ''}-disabled`]:
+          disabled || loading,
+        [`${prefixCls}-loading`]: loading,
+        [`${prefixCls}-icononly`]: !children,
+      },
+      className
+    )
 
-    const handleClick = (e: MouseEvent<HTMLButtonElement>) => {
-      if (!loading && !disabled && onClick) {
-        onClick(e)
-      }
-    }
     if (getEnv() === 'WEB') {
       ;(rest as any).type = rest.formType
     }
@@ -133,44 +155,24 @@ export const Button = React.forwardRef<HTMLButtonElement, Partial<ButtonProps>>(
         {...rest}
         ref={ref}
         formType={nativeType}
-        className={classNames(
-          prefixCls,
-          `${prefixCls}-${type}`,
-          type === 'primary' && !props.fill
-            ? `${prefixCls}-${type}-solid`
-            : null,
-          props.fill ? `${prefixCls}-${fill}` : null,
-          props.fill ? `${prefixCls}-${type}-${fill}` : null,
-          children ? '' : `${prefixCls}-icononly`,
-          {
-            [`${prefixCls}-${size}`]: size,
-            [`${prefixCls}-${shape}`]: shape,
-            [`${prefixCls}-${shape}-${size}`]: shape && size,
-            [`${prefixCls}-block`]: block,
-            [`${prefixCls}-disabled`]: disabled || loading,
-            [`${prefixCls}-${type}${props.fill ? `-${fill}` : ''}-disabled`]:
-              disabled || loading,
-            [`${prefixCls}-loading`]: loading,
-          },
-          className
-        )}
-        style={{ ...getStyle(), ...style }}
+        className={buttonClassNames}
+        style={{ ...getStyle, ...style }}
         onClick={(e) => handleClick(e as any)}
       >
         <View className="nut-button-wrap">
           {loading && <Loading className="nut-icon-loading" />}
-          {!loading && icon ? icon : null}
+          {!loading && icon}
           {children && (
             <View
               className={`nut-button-children nut-button-${size}-children nut-button-${type}-children ${!(props.fill || disabled || loading) ? '' : `nut-button-${type}${props.fill ? `-${fill}` : ''}${disabled || loading ? '-disabled' : ''}`}${icon || loading ? ` nut-button-text` : ''}${
-                rightIcon ? ` nut-button-text-right` : ''
+                rightIcon ? ' nut-button-text-right' : ''
               }`}
-              style={harmonyAndRn() ? getContStyle() : {}}
+              style={harmonyAndRn() ? getContStyle : {}}
             >
               {children}
             </View>
           )}
-          {rightIcon || null}
+          {rightIcon}
         </View>
       </TaroButton>
     )

diff --git a/src/packages/button/button.tsx b/src/packages/button/button.tsx
@@ -1,4 +1,4 @@
-import React, { CSSProperties, useCallback } from 'react'
+import React, { CSSProperties, useCallback, useMemo } from 'react'
 import type { MouseEvent } from 'react'
 import classNames from 'classnames'
 import { Loading } from '@nutui/icons-react'
@@ -33,7 +33,7 @@ export interface ButtonProps extends BasicComponent {
 
 const prefixCls = 'nut-button'
 
-const defaultProps = {
+const defaultProps: Partial<ButtonProps> = {
   ...ComponentDefaults,
   color: '',
   type: 'default',
@@ -46,8 +46,9 @@ const defaultProps = {
   icon: null,
   rightIcon: null,
   nativeType: 'button',
-  onClick: (e: MouseEvent<HTMLButtonElement>) => {},
-} as ButtonProps
+  onClick: () => {},
+}
+
 export const Button = React.forwardRef<HTMLButtonElement, Partial<ButtonProps>>(
   (props, ref) => {
     const {
@@ -67,11 +68,9 @@ export const Button = React.forwardRef<HTMLButtonElement, Partial<ButtonProps>>(
       nativeType,
       onClick,
       ...rest
-    } = {
-      ...defaultProps,
-      ...props,
-    }
-    const getStyle = useCallback(() => {
+    } = { ...defaultProps, ...props }
+
+    const getStyle = useMemo(() => {
       const style: CSSProperties = {}
       if (color) {
         if (props.fill === 'outline' || props.fill === 'dashed') {
@@ -88,43 +87,46 @@ export const Button = React.forwardRef<HTMLButtonElement, Partial<ButtonProps>>(
       return style
     }, [color, props.fill])
 
-    const handleClick = (e: MouseEvent<HTMLButtonElement>) => {
-      if (!loading && !disabled && onClick) {
-        onClick(e)
-      }
-    }
+    const handleClick = useCallback(
+      (e: MouseEvent<HTMLButtonElement>) => {
+        if (!loading && !disabled && onClick) {
+          onClick(e)
+        }
+      },
+      [loading, disabled, onClick]
+    )
+
+    const buttonClassNames = classNames(
+      prefixCls,
+      `${prefixCls}-${type}`,
+      {
+        [`${prefixCls}-${type}-solid`]: type === 'primary' && !props.fill,
+        [`${prefixCls}-${fill}`]: props.fill,
+        [`${prefixCls}-${type}-${fill}`]: props.fill,
+        [`${prefixCls}-${size}`]: size,
+        [`${prefixCls}-${shape}`]: shape,
+        [`${prefixCls}-block`]: block,
+        [`${prefixCls}-disabled`]: disabled || loading,
+        [`${prefixCls}-${type}${props.fill ? `-${fill}` : ''}-disabled`]:
+          disabled || loading,
+        [`${prefixCls}-loading`]: loading,
+        [`${prefixCls}-icononly`]: !children,
+      },
+      className
+    )
 
     return (
       <button
         {...rest}
         ref={ref}
         type={nativeType}
-        className={classNames(
-          prefixCls,
-          `${prefixCls}-${type}`,
-          type === 'primary' && !props.fill
-            ? `${prefixCls}-${type}-solid`
-            : null,
-          props.fill ? `${prefixCls}-${fill}` : null,
-          props.fill ? `${prefixCls}-${type}-${fill}` : null,
-          children ? '' : `${prefixCls}-icononly`,
-          {
-            [`${prefixCls}-${size}`]: size,
-            [`${prefixCls}-${shape}`]: shape,
-            [`${prefixCls}-block`]: block,
-            [`${prefixCls}-disabled`]: disabled || loading,
-            [`${prefixCls}-${type}${props.fill ? `-${fill}` : ''}-disabled`]:
-              disabled || loading,
-            [`${prefixCls}-loading`]: loading,
-          },
-          className
-        )}
-        style={{ ...getStyle(), ...style }}
-        onClick={(e) => handleClick(e)}
+        className={buttonClassNames}
+        style={{ ...getStyle, ...style }}
+        onClick={handleClick}
       >
         <div className="nut-button-wrap">
           {loading && <Loading className="nut-icon-loading" />}
-          {!loading && icon ? icon : null}
+          {!loading && icon}
           {children && (
             <div
               className={`${props.fill || disabled || loading ? `nut-button-${type}${props.fill ? `-${fill}` : ''}${disabled || loading ? '-disabled' : ''}` : ''}${icon || loading ? ' nut-button-text' : ''}${
@@ -134,7 +136,7 @@ export const Button = React.forwardRef<HTMLButtonElement, Partial<ButtonProps>>(
               {children}
             </div>
           )}
-          {rightIcon || null}
+          {rightIcon}
         </div>
       </button>
     )