Merge branch 'next' into feat/pnpm-workspace

drl990114 · drl990114 · commit bed97cf792e1 · 2023-10-20T20:47:37.000+08:00
diff --git a/packages/taro-ui-docs/markdown/list.md b/packages/taro-ui-docs/markdown/list.md
@@ -159,12 +159,12 @@ import { AtList, AtListItem } from "taro-ui"
 
 | 参数          | 说明             | 类型                                                                 | 可选值                 | 默认值  |
 | ------------- | ---------------- | -------------------------------------------------------------------- | ---------------------- | ------- |
-| title         | 元素的标题       | String                                                               | -                      | -       |
+| title         | 元素的标题       | JSX.Element                                                          | -                      | -       |
 | disabled      | 是否禁用         | Boolean                                                              | -                      | `false` |
-| note          | 元素的描述信息   | String                                                               | -                      | -       |
+| note          | 元素的描述信息   | JSX.Element                                                          | -                      | -       |
 | thumb         | 元素的主要缩略图 | String                                                               | -                      | -       |
 | arrow         | 箭头的方向       | String                                                               | `right`,`top`,`down` | -       |
-| extraText     | 额外信息的文本   | String                                                               | -                      | -       |
+| extraText     | 额外信息的文本   | JSX.Element                                                          | -                      | -       |
 | extraThumb    | 额外信息的缩略图 | String                                                               | -                      | -       |
 | isSwitch      | 额外信息是否开关 | Boolean                                                              | -                      | `false` |
 | switchColor   | 开关的颜色       | String                                                               | -                      | `#6190E8` |
diff --git a/packages/taro-ui-docs/markdown/tabbar.md b/packages/taro-ui-docs/markdown/tabbar.md
@@ -186,7 +186,7 @@ export default class Index extends Taro.Component {
 
 | 参数       | 说明                                   | 类型    | 可选值                                                              | 默认值   | 可选或必填
 | ---------- | -------------------------------------- | ------- | ------------------------------------------------------------------- | -------- |-------- |
-| title | 标题  | String  | - | 0 | 必填 |
+| title | 标题  | ReactNode  | - | - | 必填 |
 | iconPrefixClass |  icon className 前缀，用于第三方字体图标库，比如想使用'fa fa-clock' 的图标，则 传入`iconPrefixClass='fa' iconType='clock'`,[拓展图标库详细](/#/docs/icon) | String | - | - | - |
 | iconType | 未选中时展示的 icon 类型，可扩展第三方字体图标库，[拓展图标库详细](/#/docs/icon)  | String | - | - | 可选 |
 | selectedIconType  | 选中时展示的 icon 类型，可扩展第三方字体图标库，[拓展图标库详细](/#/docs/icon)  | String | - | - |可选 |
diff --git a/packages/taro-ui/src/common/utils.ts b/packages/taro-ui/src/common/utils.ts
@@ -1,4 +1,5 @@
 import Taro from '@tarojs/taro'
+import React from 'react'
 import { SelectorQuery } from '@tarojs/taro/types/index'
 
 const ENV = Taro.getEnv()
@@ -255,6 +256,21 @@ function mergeStyle(
   return objectToString(style1) + objectToString(style2)
 }
 
+/**
+ * 自定义验证器，用于验证参数是否是 JSX.Element
+ * @param {any} props
+ * @param {string} propName
+ * @param {string} componentName
+ * @returns
+ */
+function isJSXElement(props, propName, componentName) {
+  if (!React.isValidElement(props[propName])) {
+    return new Error(
+      `Invalid prop ${propName} supplied to ${componentName}. It must be a valid JSX element.`
+    )
+  }
+}
+
 export {
   delay,
   delayQuerySelector,
@@ -266,5 +282,6 @@ export {
   handleTouchScroll,
   delayGetClientRect,
   delayGetScrollOffset,
-  mergeStyle
+  mergeStyle,
+  isJSXElement
 }
diff --git a/packages/taro-ui/src/components/countdown/index.tsx b/packages/taro-ui/src/components/countdown/index.tsx
@@ -55,6 +55,7 @@ export default class AtCountdown extends React.Component<
   private clearTimer(): void {
     if (this.timer) {
       clearTimeout(this.timer as number)
+      this.timer = 0
     }
   }
 
@@ -127,14 +128,9 @@ export default class AtCountdown extends React.Component<
   }
 
   public render(): JSX.Element {
-    const {
-      className,
-      customStyle,
-      format = { day: '天', hours: '时', minutes: '分', seconds: '秒' },
-      isShowDay,
-      isCard,
-      isShowHour
-    } = this.props
+    const { className, customStyle, format, isShowDay, isCard, isShowHour } =
+      this.props
+
     const { _day, _hours, _minutes, _seconds } = this.state
 
     return (
diff --git a/packages/taro-ui/src/components/list/item/index.tsx b/packages/taro-ui/src/components/list/item/index.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import { Image, Switch, Text, View } from '@tarojs/components'
 import { CommonEvent, ITouchEvent } from '@tarojs/components/types/common'
 import { AtListItemProps } from '../../../../types/list'
-import { mergeStyle } from '../../../common/utils'
+import { mergeStyle, isJSXElement } from '../../../common/utils'
 
 export default class AtListItem extends React.Component<AtListItemProps> {
   public static defaultProps: AtListItemProps
@@ -43,10 +43,7 @@ export default class AtListItem extends React.Component<AtListItemProps> {
       switchIsCheck
     } = this.props
 
-    let { extraText, title } = this.props
-
-    extraText = String(extraText)
-    title = String(title)
+    const { extraText, title } = this.props
 
     const rootClass = classNames(
       'at-list__item',
@@ -156,16 +153,16 @@ AtListItem.defaultProps = {
 }
 
 AtListItem.propTypes = {
-  note: PropTypes.string,
+  note: isJSXElement,
   disabled: PropTypes.bool,
-  title: PropTypes.string,
+  title: isJSXElement,
   thumb: PropTypes.string,
   onClick: PropTypes.func,
   isSwitch: PropTypes.bool,
   hasBorder: PropTypes.bool,
   switchColor: PropTypes.string,
   switchIsCheck: PropTypes.bool,
-  extraText: PropTypes.string,
+  extraText: isJSXElement,
   extraThumb: PropTypes.string,
   onSwitchChange: PropTypes.func,
   arrow: PropTypes.oneOf(['up', 'down', 'right']),
diff --git a/packages/taro-ui/src/components/tab-bar/index.tsx b/packages/taro-ui/src/components/tab-bar/index.tsx
@@ -82,7 +82,7 @@ export default class AtTabBar extends React.Component<AtTabBarProps> {
               'at-tab-bar__item--active': current === i
             })}
             style={current === i ? selectedStyle : defaultStyle}
-            key={item.title}
+            key={i}
             onClick={this.handleClick.bind(this, i)}
           >
             {item.iconType ? (
diff --git a/packages/taro-ui/types/tab-bar.d.ts b/packages/taro-ui/types/tab-bar.d.ts
@@ -1,4 +1,4 @@
-import { MouseEvent, ComponentClass } from 'react'
+import { ReactNode, ComponentClass } from 'react'
 import { CommonEvent } from '@tarojs/components/types/common'
 
 import AtComponent from './base'
@@ -20,7 +20,7 @@ export interface TabItem {
   /**
    * 标题
    */
-  title: string
+  title: ReactNode
   /**
    * icon className 前缀，用于第三方字体图标库，
    * 比如想使用'fa fa-clock' 的图标，则传入 iconPrefixClass='fa' iconType='clock'，

Original file line number	Diff line number	Diff line change
`@@ -82,7 +82,7 @@ export default class AtTabBar extends React.Component<AtTabBarProps> {`
`82`	`82`	`'at-tab-bar__item--active': current === i`
`83`	`83`	`})}`
`84`	`84`	`style={current === i ? selectedStyle : defaultStyle}`
`85`		`- key={item.title}`
	`85`	`+ key={i}`
`86`	`86`	`onClick={this.handleClick.bind(this, i)}`
`87`	`87`	`>`
`88`	`88`	`{item.iconType ? (`