From 296ae241ea4372c79919a1fdfeb69cb3898ab64e Mon Sep 17 00:00:00 2001 From: HQ-Lin Date: Thu, 11 Aug 2022 16:00:13 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E9=87=8D=E6=9E=84=20InputNumber=20?= =?UTF-8?q?=E7=BB=84=E4=BB=B6=20&=20=E6=94=AF=E6=8C=8116=20=E4=BD=8D?= =?UTF-8?q?=E5=A4=A7=E6=95=B0=E5=AD=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/_common | 2 +- .../__snapshots__/checkbox.test.tsx.snap | 5 +- .../__snapshots__/color-picker.test.tsx.snap | 88 +- .../__snapshots__/form.test.tsx.snap | 1 + src/input-number/InputNumber.tsx | 332 +-- src/input-number/StepHandler.tsx | 103 - .../__snapshots__/input-number.test.tsx.snap | 2576 +++++++++-------- .../__tests__/input-number.test.tsx | 2 +- src/input-number/_example/align.jsx | 22 +- src/input-number/_example/auto-width.jsx | 2 +- src/input-number/_example/center.jsx | 73 +- src/input-number/_example/format.jsx | 31 +- src/input-number/_example/large-number.jsx | 11 + src/input-number/_example/left.jsx | 2 +- src/input-number/_example/normal.jsx | 17 +- src/input-number/_example/size.jsx | 39 +- src/input-number/_example/status.jsx | 109 +- src/input-number/_example/step.jsx | 2 +- src/input-number/defaultProps.ts | 2 + src/input-number/input-number.en-US.md | 37 + src/input-number/input-number.md | 35 +- src/input-number/type.ts | 75 +- src/input-number/useInputNumber.tsx | 191 ++ src/input-number/utils/numberUtils.ts | 46 - src/pagination/Pagination.tsx | 6 +- .../__snapshots__/pagination.test.tsx.snap | 11 +- .../__snapshots__/popup.test.tsx.snap | 2 +- src/popup/_example/style.jsx | 6 +- src/slider/type.ts | 2 +- .../__snapshots__/table.test.tsx.snap | 12 +- .../__snapshots__/transfer.test.tsx.snap | 10 +- test/ssr/__snapshots__/ssr.test.js.snap | 60 +- 32 files changed, 2028 insertions(+), 1884 deletions(-) delete mode 100644 src/input-number/StepHandler.tsx create mode 100644 src/input-number/_example/large-number.jsx create mode 100644 src/input-number/input-number.en-US.md create mode 100644 src/input-number/useInputNumber.tsx delete mode 100644 src/input-number/utils/numberUtils.ts diff --git a/src/_common b/src/_common index 12fd6dbf5..ed94927db 160000 --- a/src/_common +++ b/src/_common @@ -1 +1 @@ -Subproject commit 12fd6dbf59210729e80ffa7e2971ee9a20da5305 +Subproject commit ed94927db6e36444cfbf719822f18213b9e7f9f0 diff --git a/src/checkbox/__tests__/__snapshots__/checkbox.test.tsx.snap b/src/checkbox/__tests__/__snapshots__/checkbox.test.tsx.snap index f27befe01..c26818025 100644 --- a/src/checkbox/__tests__/__snapshots__/checkbox.test.tsx.snap +++ b/src/checkbox/__tests__/__snapshots__/checkbox.test.tsx.snap @@ -796,7 +796,7 @@ exports[`max.jsx 1`] = ` type="button" >
) => { - const { - align, - className, - style, - defaultValue, - value, - disabled, - size, - theme, - step, - max, - min, - decimalPlaces, - format, - onChange, - onBlur, - onFocus, - onEnter, - onKeydown, - onKeyup, - onKeypress, - ...restInputProps - } = props; - - const { classPrefix } = useConfig(); - const commonClassNames = useCommonClassName(); - const componentType = 'input-number'; - const inputClassName = `${classPrefix}-${componentType}`; - - const getRangeValue = (value: number) => { - if (value < min) return min; - if (value > max) return max; +import Button from '../button'; - return value; - }; +import useInputNumber from './useInputNumber'; +import useGlobalIcon from '../hooks/useGlobalIcon'; +import { inputNumberDefaultProps } from './defaultProps'; - const [internalInputValue, setInternalInputValue] = useState(() => { - let initialValue: InputNumberInternalValue = ''; - if (!numberUtils.isInvalidNumber(defaultValue)) { - initialValue = getRangeValue(Number(defaultValue)); - } - if (!numberUtils.isInvalidNumber(value)) { - initialValue = value; - } +import { StyledProps } from '../common'; +import { TdInputNumberProps } from './type'; - if (format && initialValue !== '') { - return format(getRangeValue(Number(initialValue))) || ''; - } +export interface InputNumberProps extends TdInputNumberProps, StyledProps {} - return initialValue; +function TdInputNumber(props: InputNumberProps, ref: any) { + const { ChevronDownIcon, RemoveIcon, ChevronUpIcon, AddIcon } = useGlobalIcon({ + ChevronDownIcon: TdChevronDownIcon, + RemoveIcon: TdRemoveIcon, + ChevronUpIcon: TdChevronUpIcon, + AddIcon: TdAddIcon, }); + const { + classPrefix, + wrapClasses, + addClasses, + reduceClasses, + listeners, + isError, + inputRef, + userInput, + handleAdd, + handleReduce, + onInnerInputChange, + } = useInputNumber(props as any); + + const wrapRef = useRef(null); + + const status = isError ? 'error' : props.status; + const addIcon = props.theme === 'column' ? : ; + const reduceIcon = + props.theme === 'column' ? : ; + + useImperativeHandle(ref, () => ({ + currentElement: wrapRef.current, + inputElement: inputRef.current, + })); - let decimalValue: number = internalInputValue as number; - if (typeof internalInputValue === 'string') { - decimalValue = Number(numberUtils.strToNumber(internalInputValue)) || 0; - } - - const setInputValue = (inputStr: string) => { - if (['', undefined].includes(inputStr)) { - return setInternalInputValue(''); - } - - const formattedInputValue = format?.(Number(inputStr)) ?? inputStr; - setInternalInputValue(formattedInputValue); - }; - - const [isError, setError] = useState(false); - const disabledDecrease = disabled || isError || (decimalValue - step < min && internalInputValue !== ''); - const disabledIncrease = disabled || isError || (decimalValue + step > max && internalInputValue !== ''); - - const isOutOfRange = (number: number): boolean => number > max || number < min; - const checkInput = (inputStr: InputNumberInternalValue): boolean => { - if (inputStr === '') { - setError(false); - return true; - } - - const hasError = numberUtils.isInvalidNumber(inputStr) || isOutOfRange(Number(inputStr)); - setError(hasError); - return !hasError; - }; - - const stepPrecision = useMemo(() => numberUtils.getNumberPrecision(step), [step]); - - const getPrecision = useCallback( - (str: InputNumberInternalValue): number => { - const numberPrecision = numberUtils.getNumberPrecision(str); - - return decimalPlaces ?? Math.max(numberPrecision, stepPrecision); - }, - [stepPrecision, decimalPlaces], - ); - - useEffect(() => { - if (value !== undefined) { - checkInput(value); - } - }, [value]); // eslint-disable-line - - useUpdateEffect(() => { - setInputValue((value ?? '').toString()); - }, [value]); - - const triggerValueUpdate = (action: ChangeContext) => { - const { value, ...context } = action; - if (!disabled) { - onChange?.(value, context); - } - }; - - const onInternalInput = (inputStr: string, { e }) => { - if (inputStr === '') { - setInputValue(inputStr); - return triggerValueUpdate({ type: 'input', value: undefined, e }); - } - if (inputStr.endsWith('.')) { - setInternalInputValue(inputStr); - return; - } - if (/^(([1-9]+[0-9]*\.0+)|(0\.0+))$/.test(inputStr)) { - setInternalInputValue(inputStr); - return; - } - const filteredInputStr = numberUtils.strToNumber(inputStr); - if (Number.isNaN(filteredInputStr)) { - setInternalInputValue(inputStr); - if (!checkInput(inputStr)) return; - } - - setInputValue(filteredInputStr.toString()); - if (!checkInput(filteredInputStr)) return; - triggerValueUpdate({ type: 'input', value: Number(filteredInputStr), e }); - }; - - const onInternalStep = (action: ChangeContext) => { - if (props.readonly) return; - - const { type, e } = action; - const currentValue = decimalValue || 0; - const precision = getPrecision(currentValue); - - let updateValue: number; - switch (type) { - case 'add': { - const addedVal = currentValue + step; - updateValue = Number(Math.max(addedVal, min).toFixed(precision)); - break; - } - case 'reduce': { - const reducedVal = currentValue - step; - updateValue = Number(Math.max(reducedVal, min).toFixed(precision)); - break; - } - } - - setInputValue(String(updateValue)); - triggerValueUpdate({ value: updateValue, type, e }); - e.preventDefault(); - }; - - const handleBlur: FocusEventHandler = (e) => { - let updateValue; - const internalFloatValue = parseFloat(internalInputValue as string); - if (internalInputValue === '') { - updateValue = undefined; - } else if (!Number.isNaN(internalFloatValue)) { - updateValue = getRangeValue(internalFloatValue); - } else { - const checkVal = (internalInputValue as string).replace(/[^0-9]/gi, ''); - updateValue = checkVal; - if (!checkVal) { - updateValue = value; - } - } - onBlur?.(updateValue, { e }); - setInputValue((updateValue ?? '').toString()); - setError(false); - - if (updateValue !== value) { - triggerValueUpdate({ value: updateValue, e, type: '' }); - } - }; - const handleFocus: FocusEventHandler = (e) => onFocus?.(decimalValue, { e }); - const handleKeydownEnter: KeyboardEventHandler = (e) => { - e.key === 'Enter' && onEnter?.(decimalValue, { e }); - }; - const handleKeydown: KeyboardEventHandler = (e) => { - onKeydown?.(decimalValue, { e }); - handleKeydownEnter(e); - }; - const handleKeyup: KeyboardEventHandler = (e) => onKeyup?.(decimalValue, { e }); - const handleKeypress: KeyboardEventHandler = (e) => onKeypress?.(decimalValue, { e }); return ( -
- - + {props.theme !== 'normal' && ( +
); -}); +} + +const InputNumber = forwardRef(TdInputNumber); InputNumber.displayName = 'InputNumber'; InputNumber.defaultProps = inputNumberDefaultProps; diff --git a/src/input-number/StepHandler.tsx b/src/input-number/StepHandler.tsx deleted file mode 100644 index fd85bf83e..000000000 --- a/src/input-number/StepHandler.tsx +++ /dev/null @@ -1,103 +0,0 @@ -import React, { useRef } from 'react'; -import classNames from 'classnames'; - -import { - AddIcon as TdAddIcon, - RemoveIcon as TdRemoveIcon, - ChevronUpIcon as TdChevronUpIcon, - ChevronDownIcon as TdChevronDownIcon, -} from 'tdesign-icons-react'; -import useGlobalIcon from '../hooks/useGlobalIcon'; -import useCommonClassName from '../_util/useCommonClassName'; -import Button from '../button'; - -import { InputNumberProps, ChangeContext } from './InputNumber'; - -export interface StepHandlerProps { - prefixClassName: string; - theme: InputNumberProps['theme']; - onStep: React.Dispatch; - disabledDecrease: boolean; - disabledIncrease: boolean; - children: React.ReactElement; -} - -let timer: NodeJS.Timer; -const triggerDelay = 500; -const stepDelay = 200; -export default function StepHandler(props: StepHandlerProps) { - const { prefixClassName, theme, onStep, disabledDecrease, disabledIncrease, children } = props; - const commonClassNames = useCommonClassName(); - const { AddIcon, RemoveIcon, ChevronUpIcon, ChevronDownIcon } = useGlobalIcon({ - AddIcon: TdAddIcon, - RemoveIcon: TdRemoveIcon, - ChevronUpIcon: TdChevronUpIcon, - ChevronDownIcon: TdChevronDownIcon, - }); - - const isNormalTheme = theme === 'normal'; - const decreaseIcon = theme === 'column' ? : ; - const increaseIcon = theme === 'column' ? : ; - - const onStepSaver = useRef(); - onStepSaver.current = (params: ChangeContext) => { - const { type, e } = params; - if (type === 'reduce') { - disabledDecrease || onStep({ type, e }); - return; - } - disabledIncrease || onStep({ type, e }); - }; - - const handleMouseDown = (e, type) => { - onStepSaver.current({ type, e }); - setTimeout(() => { - timer = setInterval(() => { - onStepSaver.current({ type, e }); - }, stepDelay); - }, triggerDelay); - }; - const stopInterval = () => { - clearInterval(timer); - setTimeout(() => { - clearInterval(timer); - }, triggerDelay); - }; - - return ( - <> - {!isNormalTheme && ( - - )} - - {children} - {!isNormalTheme && ( - - )} - - ); -} diff --git a/src/input-number/__tests__/__snapshots__/input-number.test.tsx.snap b/src/input-number/__tests__/__snapshots__/input-number.test.tsx.snap index 61da5076b..668b6df96 100644 --- a/src/input-number/__tests__/__snapshots__/input-number.test.tsx.snap +++ b/src/input-number/__tests__/__snapshots__/input-number.test.tsx.snap @@ -3,227 +3,276 @@ exports[`align.jsx 1`] = `
-
- +
+ +
+
+ +
+
+ +
-
- -
-
- -
- +
+ +
+
+ +
+
+ +
-
- -
-
- -
- +
+ +
+
+ +
+
+ +
-
- +
+
+
+ +
+
+
-
-
-
-
- +
+
+
+ +
+
+
-
-
-
-
- +
+
+
+ +
+
+
@@ -241,7 +290,7 @@ exports[`auto-width.jsx 1`] = ` type="button" >
-
-`; - -exports[`center.jsx 1`] = ` - -
- -
-
- -
-
- -
-
-`; - -exports[`default.jsx 1`] = ` - -
- -
-
- -
-
- -
-
-`; - -exports[`format.jsx 1`] = ` - -
- -
-
- -
-
- -
-
-`; - -exports[`left.jsx 1`] = ` - -
- -
-
- -
-
- -
-
-`; - -exports[`normal.jsx 1`] = ` - -
-
-
- -
-
+ +
`; -exports[`size.jsx 1`] = ` +exports[`center.jsx 1`] = `
+ + 3.41 +
+
+
+
@@ -665,7 +465,7 @@ exports[`size.jsx 1`] = ` type="button" >
+
+
+
+ number can not be exceed maximum +
+
+
+
+
+`; + +exports[`default.jsx 1`] = ` + +
+ +
+
+ +
+
+ +
+
+`; + +exports[`format.jsx 1`] = ` + +
+
+
+ +
+ + 0% +
+
@@ -779,54 +735,74 @@ exports[`size.jsx 1`] = ` type="button" >
+
+
+ +`; + +exports[`large-number.jsx 1`] = ` + +
+
+ + 19999999999999999.00 +
+
+
+ + 0.8975527383412673418 +
+
+
+`; + +exports[`left.jsx 1`] = ` + +
+ +
+
+ +
+
+ +
+
+`; + +exports[`normal.jsx 1`] = ` + +
+
+
+
+ 机器: +
+
+ 台 +
+
+
+
+ + 金额: + +
+
+ + 元 + +
@@ -969,898 +1061,885 @@ exports[`size.jsx 1`] = ` `; -exports[`status.jsx 1`] = ` +exports[`size.jsx 1`] = ` -
-
+
- -
-
-
- + + + +
-
- -
+
-
+
-
-
-
- -
-
- + + + +
-
- -
+
-
+
-
-
-
- -
-
- + + + +
-
- -
+
-
+
+
+
- -
-
-
- + + + +
-
- -
+
-
+
-
-
- +
+ +
+
+ +
+
+ +
-
- + + + +
-
- -
+
-
+
+
+
- -
-
-
-
- -
+
-
-
-
- +
+
+
+ +
+
+
-
-
- -
-
- 这是普通文本提示 -
+
-
+
+
+ +`; + +exports[`status.jsx 1`] = ` + +
+
-
- -
+ + + + 隐藏文本提示 + + + + +
+
+
+
+
+ +
+
-
-
- -
+ + + +
- 这是普通文本提示 +
+ +
+
+ 这是普通文本提示 +
-
- + + + + +
-
-
-
- -
+ +
+
-
-
- -
+ + + +
- 校验通过文本提示 +
+ +
+
+ 校验通过文本提示 +
-
- + + + + +
-
-
-
- -
+ +
+
-
-
- -
+ + + +
- 校验不通过文本提示 +
+ +
+
+ 校验不通过文本提示 +
-
- + + + + +
-
-
-
- -
+ +
+
-
-
- -
+ + + +
- 校验存在严重问题文本提示 +
+ +
+
+ 校验存在严重问题文本提示 +
-
- + + + + +
-
- + +
`; @@ -1875,7 +1954,7 @@ exports[`step.jsx 1`] = ` type="button" >
@@ -1908,7 +1988,7 @@ exports[`step.jsx 1`] = ` type="button" > { ); fireEvent.mouseEnter(container.firstChild); - fireEvent.mouseDown(container.querySelector('.t-input-number__increase')); + fireEvent.click(container.querySelector('.t-input-number__increase')); expect(queryByPlaceholderText(InputNumberPlaceholder).value).toEqual('6'); }); diff --git a/src/input-number/_example/align.jsx b/src/input-number/_example/align.jsx index 0365260d8..83cff31c0 100644 --- a/src/input-number/_example/align.jsx +++ b/src/input-number/_example/align.jsx @@ -1,16 +1,20 @@ import React from 'react'; -import { InputNumber } from 'tdesign-react'; +import { InputNumber, Space } from 'tdesign-react'; export default function InputNumberExample() { return ( -
- - - + + + + + + - - - -
+ + + + + + ); } diff --git a/src/input-number/_example/auto-width.jsx b/src/input-number/_example/auto-width.jsx index 5c189c768..9a38f9f46 100644 --- a/src/input-number/_example/auto-width.jsx +++ b/src/input-number/_example/auto-width.jsx @@ -2,5 +2,5 @@ import React from 'react'; import { InputNumber } from 'tdesign-react'; export default function InputNumberAutoWidthExample() { - return ; + return ; } diff --git a/src/input-number/_example/center.jsx b/src/input-number/_example/center.jsx index 4dd28f1a7..9b6f54585 100644 --- a/src/input-number/_example/center.jsx +++ b/src/input-number/_example/center.jsx @@ -1,21 +1,64 @@ -import React, { useState } from 'react'; -import { InputNumber } from 'tdesign-react'; +import React, { useState, useMemo } from 'react'; +import { InputNumber, Space } from 'tdesign-react'; export default function InputNumberExample() { - const [value, setValue] = useState(1); + const [value1, setValue1] = useState(''); + const [value2, setValue2] = useState(100); + const [decimalValue, setDecimalValue] = useState(3.41); + const [error, setError] = useState(); + + const tips = useMemo(() => { + if (error === 'exceed-maximum') return 'number can not be exceed maximum'; + if (error === 'below-minimum') return 'number can not be below minimum'; + return undefined; + }, [error]); + + function handleChange(v, ctx) { + console.info('change', v, ctx); + setValue2(v); + } + function onValidate({ error }) { + setError(error); + } + function handleFocus(v, ctx) { + console.info('focus', v, ctx); + } + function handleBlur(v, ctx) { + console.info('blur', v, ctx); + } + function handleKeydown(v, ctx) { + console.info('keydown', v, ctx); + } + function handleKeyup(v, ctx) { + console.info('keyup', v, ctx); + } + function handleKeypress(v, ctx) { + console.info('keypress', v, ctx); + } + function handleEnter(v, ctx) { + console.info('enter', v, ctx); + } return ( - { - console.log(value); - setValue(value); - }} - > + + + + + ); } diff --git a/src/input-number/_example/format.jsx b/src/input-number/_example/format.jsx index 8c6a61f74..926e792a2 100644 --- a/src/input-number/_example/format.jsx +++ b/src/input-number/_example/format.jsx @@ -1,21 +1,26 @@ import React, { useState } from 'react'; -import { InputNumber } from 'tdesign-react'; +import { InputNumber, Space } from 'tdesign-react'; export default function InputNumberExample() { const [value, setValue] = useState(0); return ( - value + '%'} - value={value} - onChange={(value) => { - console.log(value); - setValue(value); - }} - > + + value + '%'} + value={value} + onChange={setValue} + /> + `${fixedNumber} %`} + onChange={setValue} + /> + ); } diff --git a/src/input-number/_example/large-number.jsx b/src/input-number/_example/large-number.jsx new file mode 100644 index 000000000..c7374a2f3 --- /dev/null +++ b/src/input-number/_example/large-number.jsx @@ -0,0 +1,11 @@ +import React from 'react'; +import { InputNumber, Space } from 'tdesign-react'; + +export default function InputNumberExample() { + return ( + + + + + ); +} diff --git a/src/input-number/_example/left.jsx b/src/input-number/_example/left.jsx index 2ca1fde33..c90cdadf4 100644 --- a/src/input-number/_example/left.jsx +++ b/src/input-number/_example/left.jsx @@ -2,5 +2,5 @@ import React from 'react'; import { InputNumber } from 'tdesign-react'; export default function InputNumberExample() { - return ; + return console.log(v)} />; } diff --git a/src/input-number/_example/normal.jsx b/src/input-number/_example/normal.jsx index 1560c0198..f781434d5 100644 --- a/src/input-number/_example/normal.jsx +++ b/src/input-number/_example/normal.jsx @@ -1,6 +1,19 @@ import React from 'react'; -import { InputNumber } from 'tdesign-react'; +import { InputNumber, Space } from 'tdesign-react'; export default function InputNumberExample() { - return ; + return ( + + + + 金额:} + suffix={} + /> + + ); } diff --git a/src/input-number/_example/size.jsx b/src/input-number/_example/size.jsx index ab340c6ea..91802a072 100644 --- a/src/input-number/_example/size.jsx +++ b/src/input-number/_example/size.jsx @@ -1,41 +1,26 @@ import React from 'react'; -import { InputNumber } from 'tdesign-react'; +import { InputNumber, Space } from 'tdesign-react'; export default function InputNumberExample() { - return ( -
-
- - - -
+ + + + + + -
+ -
+
-
+ -
-
+ + ); } diff --git a/src/input-number/_example/status.jsx b/src/input-number/_example/status.jsx index e9d943236..100b79dcb 100644 --- a/src/input-number/_example/status.jsx +++ b/src/input-number/_example/status.jsx @@ -1,47 +1,76 @@ -import React from 'react'; -import { Form, InputNumber } from 'tdesign-react'; +import React, { useState } from 'react'; +import { Form, InputNumber, Space, Radio } from 'tdesign-react'; const { FormItem } = Form; -function Status() { +export default function Status() { + const [type, setType] = useState('align-input'); + return ( -
+ + + 隐藏文本提示 + 文本提示左对齐 + 文本提示对齐输入框 + +
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + {type === 'hide' && ( + <> + + + + + + + + + + + + + + + + + + + + )} + + {type === 'align-left' && ( + <> + + + + + + + + + + + + + + )} + + {type === 'align-input' && ( + <> + + + + + + + + + + + + + + )}
-
+ ); } - -export default Status; diff --git a/src/input-number/_example/step.jsx b/src/input-number/_example/step.jsx index a83c04932..1d7dd6d07 100644 --- a/src/input-number/_example/step.jsx +++ b/src/input-number/_example/step.jsx @@ -4,5 +4,5 @@ import { InputNumber } from 'tdesign-react'; export default function InputNumberExample() { const [value, setValue] = useState(3.2); - return ; + return ; } diff --git a/src/input-number/defaultProps.ts b/src/input-number/defaultProps.ts index c9339a997..626122ce8 100644 --- a/src/input-number/defaultProps.ts +++ b/src/input-number/defaultProps.ts @@ -7,8 +7,10 @@ import { TdInputNumberProps } from './type'; export const inputNumberDefaultProps: TdInputNumberProps = { autoWidth: false, decimalPlaces: undefined, + largeNumber: false, max: Infinity, min: -Infinity, + placeholder: undefined, readonly: false, size: 'medium', step: 1, diff --git a/src/input-number/input-number.en-US.md b/src/input-number/input-number.en-US.md new file mode 100644 index 000000000..a903ad05c --- /dev/null +++ b/src/input-number/input-number.en-US.md @@ -0,0 +1,37 @@ +:: BASE_DOC :: + +## API +### InputNumber Props + +name | type | default | description | required +-- | -- | -- | -- | -- +className | String | - | 类名 | N +style | Object | - | 样式,Typescript:`React.CSSProperties` | N +align | String | - | options:left/center/right | N +autoWidth | Boolean | false | \- | N +decimalPlaces | Number | undefined | \- | N +disabled | Boolean | - | \- | N +format | Function | - | Typescript:`(value: T, context?: { fixedNumber?: T }) => T` | N +inputProps | Object | - | Typescript:`InputProps`,[Input API Documents](./input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/input-number/type.ts) | N +label | TNode | - | Typescript:`string | TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N +largeNumber | Boolean | false | \- | N +max | String / Number | Infinity | Typescript:`T` | N +min | String / Number | -Infinity | Typescript:`T` | N +placeholder | String | undefined | \- | N +readonly | Boolean | false | \- | N +size | String | medium | options:small/medium/large | N +status | String | - | options:default/success/warning/error | N +step | String / Number | 1 | Typescript:`T` | N +suffix | TNode | - | Typescript:`string | TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N +theme | String | row | options:column/row/normal | N +tips | TNode | - | Typescript:`string | TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N +value | String / Number | - | Typescript:`T` `type InputNumberValue = number | string`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/input-number/type.ts) | N +defaultValue | String / Number | - | uncontrolled property。Typescript:`T` `type InputNumberValue = number | string`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/input-number/type.ts) | N +onBlur | Function | | Typescript:`(value: InputNumberValue, context: { e: FocusEvent }) => void`
| N +onChange | Function | | Typescript:`(value: T, context: ChangeContext) => void`
[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/input-number/type.ts)。
`interface ChangeContext { type: ChangeSource; e: InputEvent | MouseEvent | FocusEvent | KeyboardEvent }`

`type ChangeSource = 'add' | 'reduce' | 'input' | 'blur' | 'enter' | ''`
| N +onEnter | Function | | Typescript:`(value: InputNumberValue, context: { e: KeyboardEvent }) => void`
| N +onFocus | Function | | Typescript:`(value: InputNumberValue, context: { e: FocusEvent }) => void`
| N +onKeydown | Function | | Typescript:`(value: InputNumberValue, context: { e: KeyboardEvent }) => void`
| N +onKeypress | Function | | Typescript:`(value: InputNumberValue, context: { e: KeyboardEvent }) => void`
| N +onKeyup | Function | | Typescript:`(value: InputNumberValue, context: { e: KeyboardEvent }) => void`
| N +onValidate | Function | | Typescript:`(context: { error?: 'exceed-maximum' | 'below-minimum' }) => void`
| N diff --git a/src/input-number/input-number.md b/src/input-number/input-number.md index d77535ff9..a8da80ee9 100644 --- a/src/input-number/input-number.md +++ b/src/input-number/input-number.md @@ -10,23 +10,28 @@ style | Object | - | 样式,TS 类型:`React.CSSProperties` | N align | String | - | 文本内容位置,居左/居中/居右。可选项:left/center/right | N autoWidth | Boolean | false | 宽度随内容自适应 | N decimalPlaces | Number | undefined | [小数位数](https://en.wiktionary.org/wiki/decimal_place) | N -disabled | Boolean | false | 禁用组件 | N -format | Function | - | 指定输入框展示值的格式。TS 类型:`(value: number) => number | string` | N -max | Number | Infinity | 最大值 | N -min | Number | -Infinity | 最小值 | N +disabled | Boolean | - | 禁用组件 | N +format | Function | - | 格式化输入框展示值。第二个事件参数 `context.fixedNumber` 表示处理过小数位数 `decimalPlaces` 的数字。TS 类型:`(value: T, context?: { fixedNumber?: T }) => T` | N +inputProps | Object | - | 透传 Input 输入框组件全部属性。TS 类型:`InputProps`,[Input API Documents](./input?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/input-number/type.ts) | N +label | TNode | - | 左侧文本。TS 类型:`string | TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N +largeNumber | Boolean | false | 是否作为大数使用。JS 支持的最大数字位数是 16 位,超过 16 位的数字需作为字符串大数处理。此时,数据类型必须保持为字符串,否则会丢失数据 | N +max | String / Number | Infinity | 最大值。如果是大数,请传入字符串。TS 类型:`T` | N +min | String / Number | -Infinity | 最小值。如果是大数,请传入字符串。TS 类型:`T` | N placeholder | String | undefined | 占位符 | N readonly | Boolean | false | 只读状态 | N size | String | medium | 组件尺寸。可选项:small/medium/large | N -status | String | - | 文本框状态。可选项:success/warning/error | N -step | Number | 1 | 数值改变步数,可以是小数 | N +status | String | - | 文本框状态。可选项:default/success/warning/error | N +step | String / Number | 1 | 数值改变步数,可以是小数。如果是大数,请保证数据类型为字符串。TS 类型:`T` | N +suffix | TNode | - | 后置内容。TS 类型:`string | TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N theme | String | row | 按钮布局。可选项:column/row/normal | N tips | TNode | - | 输入框下方提示文本,会根据不同的 `status` 呈现不同的样式。TS 类型:`string | TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N -value | Number | undefined | 值 | N -defaultValue | Number | undefined | 值。非受控属性 | N -onBlur | Function | | TS 类型:`(value: number, context: { e: FocusEvent }) => void`
失去焦点时触发 | N -onChange | Function | | TS 类型:`(value: number, context: ChangeContext) => void`
值变化时触发。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/input-number/type.ts)。
`interface ChangeContext { type: ChangeSource; e: InputEvent | MouseEvent | FocusEvent }`

`type ChangeSource = 'add' | 'reduce' | 'input' | ''`
| N -onEnter | Function | | TS 类型:`(value: number, context: { e: KeyboardEvent }) => void`
回车键按下时触发 | N -onFocus | Function | | TS 类型:`(value: number, context: { e: FocusEvent }) => void`
获取焦点时触发 | N -onKeydown | Function | | TS 类型:`(value: number, context: { e: KeyboardEvent }) => void`
键盘按下时触发 | N -onKeypress | Function | | TS 类型:`(value: number, context: { e: KeyboardEvent }) => void`
按下字符键时触发(keydown -> keypress -> keyup) | N -onKeyup | Function | | TS 类型:`(value: number, context: { e: KeyboardEvent }) => void`
释放键盘时触发 | N +value | String / Number | - | 数字输入框的值。当值为 '' 时,输入框显示为空。TS 类型:`T` `type InputNumberValue = number | string`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/input-number/type.ts) | N +defaultValue | String / Number | - | 数字输入框的值。当值为 '' 时,输入框显示为空。非受控属性。TS 类型:`T` `type InputNumberValue = number | string`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/input-number/type.ts) | N +onBlur | Function | | TS 类型:`(value: InputNumberValue, context: { e: FocusEvent }) => void`
失去焦点时触发 | N +onChange | Function | | TS 类型:`(value: T, context: ChangeContext) => void`
值变化时触发。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/input-number/type.ts)。
`interface ChangeContext { type: ChangeSource; e: InputEvent | MouseEvent | FocusEvent | KeyboardEvent }`

`type ChangeSource = 'add' | 'reduce' | 'input' | 'blur' | 'enter' | ''`
| N +onEnter | Function | | TS 类型:`(value: InputNumberValue, context: { e: KeyboardEvent }) => void`
回车键按下时触发 | N +onFocus | Function | | TS 类型:`(value: InputNumberValue, context: { e: FocusEvent }) => void`
获取焦点时触发 | N +onKeydown | Function | | TS 类型:`(value: InputNumberValue, context: { e: KeyboardEvent }) => void`
键盘按下时触发 | N +onKeypress | Function | | TS 类型:`(value: InputNumberValue, context: { e: KeyboardEvent }) => void`
按下字符键时触发(keydown -> keypress -> keyup) | N +onKeyup | Function | | TS 类型:`(value: InputNumberValue, context: { e: KeyboardEvent }) => void`
释放键盘时触发 | N +onValidate | Function | | TS 类型:`(context: { error?: 'exceed-maximum' | 'below-minimum' }) => void`
最大值或最小值校验结束后触发,`exceed-maximum` 表示超出最大值,`below-minimum` 表示小于最小值 | N diff --git a/src/input-number/type.ts b/src/input-number/type.ts index 8b8ce62c2..9d0ef4efb 100644 --- a/src/input-number/type.ts +++ b/src/input-number/type.ts @@ -4,10 +4,11 @@ * 该文件为脚本自动生成文件,请勿随意修改。如需修改请联系 PMC * */ +import { InputProps } from '../input'; import { TNode } from '../common'; import { MouseEvent, KeyboardEvent, FocusEvent, FormEvent } from 'react'; -export interface TdInputNumberProps { +export interface TdInputNumberProps { /** * 文本内容位置,居左/居中/居右 */ @@ -23,23 +24,35 @@ export interface TdInputNumberProps { decimalPlaces?: number; /** * 禁用组件 - * @default false */ disabled?: boolean; /** - * 指定输入框展示值的格式 + * 格式化输入框展示值。第二个事件参数 `context.fixedNumber` 表示处理过小数位数 `decimalPlaces` 的数字 + */ + format?: (value: T, context?: { fixedNumber?: T }) => T; + /** + * 透传 Input 输入框组件全部属性 */ - format?: (value: number) => number | string; + inputProps?: InputProps; /** - * 最大值 + * 左侧文本 + */ + label?: TNode; + /** + * 是否作为大数使用。JS 支持的最大数字位数是 16 位,超过 16 位的数字需作为字符串大数处理。此时,数据类型必须保持为字符串,否则会丢失数据 + * @default false + */ + largeNumber?: boolean; + /** + * 最大值。如果是大数,请传入字符串 * @default Infinity */ - max?: number; + max?: T; /** - * 最小值 + * 最小值。如果是大数,请传入字符串 * @default -Infinity */ - min?: number; + min?: T; /** * 占位符 */ @@ -57,12 +70,16 @@ export interface TdInputNumberProps { /** * 文本框状态 */ - status?: 'success' | 'warning' | 'error'; + status?: 'default' | 'success' | 'warning' | 'error'; /** - * 数值改变步数,可以是小数 + * 数值改变步数,可以是小数。如果是大数,请保证数据类型为字符串 * @default 1 */ - step?: number; + step?: T; + /** + * 后置内容 + */ + suffix?: TNode; /** * 按钮布局 * @default row @@ -73,46 +90,56 @@ export interface TdInputNumberProps { */ tips?: TNode; /** - * 值 + * 数字输入框的值。当值为 '' 时,输入框显示为空 */ - value?: number; + value?: T; /** - * 值,非受控属性 + * 数字输入框的值。当值为 '' 时,输入框显示为空,非受控属性 */ - defaultValue?: number; + defaultValue?: T; /** * 失去焦点时触发 */ - onBlur?: (value: number, context: { e: FocusEvent }) => void; + onBlur?: (value: InputNumberValue, context: { e: FocusEvent }) => void; /** * 值变化时触发 */ - onChange?: (value: number, context: ChangeContext) => void; + onChange?: (value: T, context: ChangeContext) => void; /** * 回车键按下时触发 */ - onEnter?: (value: number, context: { e: KeyboardEvent }) => void; + onEnter?: (value: InputNumberValue, context: { e: KeyboardEvent }) => void; /** * 获取焦点时触发 */ - onFocus?: (value: number, context: { e: FocusEvent }) => void; + onFocus?: (value: InputNumberValue, context: { e: FocusEvent }) => void; /** * 键盘按下时触发 */ - onKeydown?: (value: number, context: { e: KeyboardEvent }) => void; + onKeydown?: (value: InputNumberValue, context: { e: KeyboardEvent }) => void; /** * 按下字符键时触发(keydown -> keypress -> keyup) */ - onKeypress?: (value: number, context: { e: KeyboardEvent }) => void; + onKeypress?: (value: InputNumberValue, context: { e: KeyboardEvent }) => void; /** * 释放键盘时触发 */ - onKeyup?: (value: number, context: { e: KeyboardEvent }) => void; + onKeyup?: (value: InputNumberValue, context: { e: KeyboardEvent }) => void; + /** + * 最大值或最小值校验结束后触发,`exceed-maximum` 表示超出最大值,`below-minimum` 表示小于最小值 + */ + onValidate?: (context: { error?: 'exceed-maximum' | 'below-minimum' }) => void; } +export type InputNumberValue = number | string; + export interface ChangeContext { type: ChangeSource; - e: FormEvent | MouseEvent | FocusEvent; + e: + | FormEvent + | MouseEvent + | FocusEvent + | KeyboardEvent; } -export type ChangeSource = 'add' | 'reduce' | 'input' | ''; +export type ChangeSource = 'add' | 'reduce' | 'input' | 'blur' | 'enter' | ''; diff --git a/src/input-number/useInputNumber.tsx b/src/input-number/useInputNumber.tsx new file mode 100644 index 000000000..ed7a79ca0 --- /dev/null +++ b/src/input-number/useInputNumber.tsx @@ -0,0 +1,191 @@ +import React, { useState, useRef, useEffect } from 'react'; +import classNames from 'classnames'; +import useConfig from '../hooks/useConfig'; +import useControlled from '../hooks/useControlled'; +import useCommonClassName from '../_util/useCommonClassName'; +import { InputNumberValue, TdInputNumberProps } from './type'; +// 计算逻辑,统一到 common 中,方便各框架复用(如超过 16 位的大数处理) +import { + canAddNumber, + canInputNumber, + canReduceNumber, + formatToNumber, + getMaxOrMinValidateResult, + getStepValue, +} from '../_common/js/input-number/number'; + +/** + * 独立一个组件 Hook 方便用户直接使用相关逻辑 自定义任何样式的数字输入框 + */ +export default function useInputNumber(props: TdInputNumberProps) { + const { SIZE, STATUS } = useCommonClassName(); + const { classPrefix } = useConfig(); + const [value, onChange] = useControlled(props, 'value', props.onChange); + const [userInput, setUserInput] = useState(''); + const [displayValue, setDisplayValue] = useState(''); + const [isError, setIsError] = useState<'exceed-maximum' | 'below-minimum'>(); + + const inputRef = useRef(null); + + const { max, min, largeNumber, onValidate } = props; + + const disabledReduce = props.disabled || !canReduceNumber(value, props.min, props.largeNumber); + const disabledAdd = props.disabled || !canAddNumber(value, props.max, props.largeNumber); + + const wrapClasses = classNames(`${classPrefix}-input-number`, SIZE[props.size], { + [STATUS.disabled]: props.disabled, + [`${classPrefix}-is-controls-right`]: props.theme === 'column', + [`${classPrefix}-input-number--${props.theme}`]: props.theme, + [`${classPrefix}-input-number--auto-width`]: props.autoWidth, + }); + + const reduceClasses = classNames(`${classPrefix}-input-number__decrease`, { [STATUS.disabled]: disabledReduce }); + const addClasses = classNames(`${classPrefix}-input-number__increase`, { [STATUS.disabled]: disabledAdd }); + + const getUserInput = (value: InputNumberValue) => { + if (!value && value !== 0) return ''; + let inputStr = String(value); + if (!inputRef.current.currentElement.contains?.(document.activeElement)) { + inputStr = String( + formatToNumber(inputStr, { + decimalPlaces: props.decimalPlaces, + largeNumber: props.largeNumber, + }), + ); + if (props.format) { + inputStr = String(props.format(value, { fixedNumber: inputStr })); + } + } + return inputStr; + }; + + useEffect(() => { + const inputValue = [undefined, null].includes(value) ? '' : String(value); + setUserInput(getUserInput(inputValue)); + // eslint-disable-next-line + }, [value]); + + useEffect(() => { + // @ts-ignore + if ([undefined, '', null].includes(value)) return; + const error = getMaxOrMinValidateResult({ + value, + max, + min, + largeNumber, + }); + setIsError(error); + onValidate?.({ error }); + }, [value, max, min, largeNumber, onValidate]); + + const handleStepValue = (op: 'add' | 'reduce') => + getStepValue({ + op, + step: props.step, + max: props.max, + min: props.min, + lastValue: value, + largeNumber: props.largeNumber, + }); + + const handleReduce = (e: any) => { + if (disabledReduce || props.readonly) return; + const newValue = handleStepValue('reduce'); + onChange(newValue, { type: 'reduce', e }); + }; + + const handleAdd = (e: any) => { + if (disabledAdd || props.readonly) return; + const newValue = handleStepValue('add'); + onChange(newValue, { type: 'add', e }); + }; + + const onInnerInputChange = (val: string, ctx: { e: any }) => { + if (!canInputNumber(val, props.largeNumber)) return; + setUserInput(val); + // 大数-字符串;普通数-数字 + const newVal = props.largeNumber || !val ? val : Number(val); + if (newVal !== value && !['-', '.', 'e', 'E'].includes(val.slice(-1))) { + onChange(newVal, { type: 'input', e: ctx.e }); + } + }; + + const handleBlur = (value: string, ctx: { e: React.FocusEvent }) => { + setUserInput(getUserInput(value)); + const newValue = formatToNumber(value, { + decimalPlaces: props.decimalPlaces, + largeNumber: props.largeNumber, + }); + if (newValue !== value && String(newValue) !== value) { + onChange(newValue, { type: 'blur', e: ctx.e }); + } + props.onBlur?.(newValue, ctx); + }; + + const handleFocus = (_: string, ctx: { e: React.FocusEvent }) => { + setUserInput(value as string); + props.onFocus?.(value, ctx); + }; + + const handleKeydown = (value: string, ctx: { e: React.KeyboardEvent }) => { + const { e } = ctx; + const keyEvent = { + ArrowUp: handleAdd, + ArrowDown: handleReduce, + }; + const code = e.code || e.key; + if (keyEvent[code] !== undefined) { + keyEvent[code](e); + } + props.onKeydown?.(value, ctx); + }; + + const handleKeyup = (value: string, ctx: { e: React.KeyboardEvent }) => { + props.onKeyup?.(value, ctx); + }; + + const handleKeypress = (value: string, ctx: { e: React.KeyboardEvent }) => { + props.onKeypress?.(value, ctx); + }; + + const handleEnter = (value: string, ctx: { e: React.KeyboardEvent }) => { + setUserInput(getUserInput(value)); + const newValue = formatToNumber(value, { + decimalPlaces: props.decimalPlaces, + largeNumber: props.largeNumber, + }); + if (newValue !== value && String(newValue) !== value) { + onChange(newValue, { type: 'enter', e: ctx.e }); + } + props.onEnter?.(newValue, ctx); + }; + + const listeners = { + onBlur: handleBlur, + onFocus: handleFocus, + onKeydown: handleKeydown, + onKeyup: handleKeyup, + onKeypress: handleKeypress, + onEnter: handleEnter, + }; + + return { + classPrefix, + wrapClasses, + reduceClasses, + addClasses, + inputRef, + listeners, + displayValue, + setDisplayValue, + isError, + setIsError, + userInput, + setUserInput, + value, + onChange, + handleReduce, + handleAdd, + onInnerInputChange, + }; +} diff --git a/src/input-number/utils/numberUtils.ts b/src/input-number/utils/numberUtils.ts deleted file mode 100644 index 0bd28e810..000000000 --- a/src/input-number/utils/numberUtils.ts +++ /dev/null @@ -1,46 +0,0 @@ -import { InputNumberInternalValue } from '../InputNumber'; - -export const isInvalidNumber = (number: number | string) => { - if (typeof number === 'number') { - return Number.isNaN(number); - } - - if (!number) { - return true; - } - - // 普通数字 1.1 1 - // 小数点在后 1. - // 小数点在后 .1 - return !(/^\s*-?\d+(\.\d+)?\s*$/.test(number) || /^\s*-?\d+\.\s*$/.test(number) || /^\s*-?\.\d+\s*$/.test(number)); -}; - -export const getNumberPrecision = (number: number | string) => { - const numStr = String(number); - - return numStr.includes('.') ? numStr.length - numStr.indexOf('.') - 1 : 0; -}; - -const multiE = (s: string) => { - const m = s.match(/[e]/gi); - return m === null ? false : m.length > 1; -}; -const multiDot = (s: string) => { - const m = s.match(/[.]/g); - return m === null ? false : m.length > 1; -}; -const multiNegative = (s: string) => { - const m = s.match(/[-]/g); - return m === null ? false : m.length > 1; -}; -export const strToNumber = (s: string): InputNumberInternalValue => { - if (['', undefined].includes(s)) { - return 0; - } - let filterVal = s.replace(/[^\d.eE。-]/g, '').replace('。', '.'); - if (multiE(filterVal) || multiDot(filterVal) || multiNegative(filterVal)) { - filterVal = filterVal.substr(0, filterVal.length - 1); - } - - return filterVal; -}; diff --git a/src/pagination/Pagination.tsx b/src/pagination/Pagination.tsx index 4bdee6ecd..b84d0ccbd 100644 --- a/src/pagination/Pagination.tsx +++ b/src/pagination/Pagination.tsx @@ -166,9 +166,9 @@ const Pagination = forwardRef((props: PaginationProps, ref: React.Ref setJumpValue(val)} - onBlur={(val) => changeCurrent(val)} - onEnter={(val) => changeCurrent(val)} + onChange={(val: number) => setJumpValue(val)} + onBlur={(val: number) => changeCurrent(val)} + onEnter={(val: number) => changeCurrent(val)} placeholder="" /> diff --git a/src/pagination/__tests__/__snapshots__/pagination.test.tsx.snap b/src/pagination/__tests__/__snapshots__/pagination.test.tsx.snap index 2271d74a5..70cf68546 100644 --- a/src/pagination/__tests__/__snapshots__/pagination.test.tsx.snap +++ b/src/pagination/__tests__/__snapshots__/pagination.test.tsx.snap @@ -312,7 +312,7 @@ exports[`jump.jsx 1`] = ` class="t-input-adornment t-input-adornment--append" >
- 根据 trigger 元素定制 overlayStyle + 根据 trigger 元素定制 overlayInnerStyle
diff --git a/src/popup/_example/style.jsx b/src/popup/_example/style.jsx index 6fe3ef9c2..650a4d698 100644 --- a/src/popup/_example/style.jsx +++ b/src/popup/_example/style.jsx @@ -6,7 +6,7 @@ export default function OverlayStyle() { @@ -14,10 +14,10 @@ export default function OverlayStyle() { ({ width: `${triggerElem.offsetWidth}px` })} + overlayInnerStyle={(triggerElem) => ({ width: `${triggerElem.offsetWidth}px` })} content="这是一个弹出框" > - + ); diff --git a/src/slider/type.ts b/src/slider/type.ts index 8568990b8..8fcdf17cd 100644 --- a/src/slider/type.ts +++ b/src/slider/type.ts @@ -18,7 +18,7 @@ export interface TdSliderProps { * 用于控制数字输入框组件,值为 false 表示不显示数字输入框;值为 true 表示呈现默认数字输入框;值类型为 Object 表示透传属性到数字输入框组件 * @default false */ - inputNumberProps?: boolean | InputNumberProps; + inputNumberProps?: boolean | InputNumberProps; /** * 滑块当前值文本。
值为 true 显示默认文案;值为 false 不显示滑块当前值文本;
值为 `${value}%` 则表示组件会根据占位符渲染文案;
值类型为函数时,参数 `value` 标识滑块值,参数 `position=start` 表示范围滑块的起始值,参数 `position=end` 表示范围滑块的终点值 * @default true diff --git a/src/table/__tests__/__snapshots__/table.test.tsx.snap b/src/table/__tests__/__snapshots__/table.test.tsx.snap index a05300f57..3dcb55527 100644 --- a/src/table/__tests__/__snapshots__/table.test.tsx.snap +++ b/src/table/__tests__/__snapshots__/table.test.tsx.snap @@ -1732,7 +1732,7 @@ exports[`base.jsx 1`] = ` class="t-input-adornment t-input-adornment--append" >
"`; -exports[`ssr snapshot test renders ./src/checkbox/_example/max.jsx correctly 1`] = `"
最多可选:
选中值: 北京
"`; +exports[`ssr snapshot test renders ./src/checkbox/_example/max.jsx correctly 1`] = `"
最多可选:
选中值: 北京
"`; exports[`ssr snapshot test renders ./src/collapse/_example/base.jsx correctly 1`] = `"
这是一个折叠标题
这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。
设置默认展开项
这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。
自定义折叠面板内容
VueReact
当前折叠面板折叠时,销毁面板内容
嵌套使用折叠面板
这是一个折叠标题
这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。
这是一个折叠标题
这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。
"`; @@ -202,17 +202,17 @@ exports[`ssr snapshot test renders ./src/collapse/_example/rightSlot.jsx correct exports[`ssr snapshot test renders ./src/color-picker/_example/color-mode.jsx correctly 1`] = `"
默认(单色 + 线性渐变)
#0052d9
仅单色模式
#0052d9
仅线性渐变模式
linear-gradient(45deg, #4facfe 0%, #00f2fe 100%)
"`; -exports[`ssr snapshot test renders ./src/color-picker/_example/enable-alpha.jsx correctly 1`] = `"
请选择

最近使用颜色

    系统预设颜色

    "`; +exports[`ssr snapshot test renders ./src/color-picker/_example/enable-alpha.jsx correctly 1`] = `"
    请选择

    最近使用颜色

      系统预设颜色

      "`; -exports[`ssr snapshot test renders ./src/color-picker/_example/panel.jsx correctly 1`] = `"
      请选择

      最近使用颜色

        系统预设颜色

        "`; +exports[`ssr snapshot test renders ./src/color-picker/_example/panel.jsx correctly 1`] = `"
        请选择

        最近使用颜色

          系统预设颜色

          "`; -exports[`ssr snapshot test renders ./src/color-picker/_example/recent-color.jsx correctly 1`] = `"
          预设最近使用色
          请选择

          最近使用颜色

          系统预设颜色

          完全不显示最近使用色
          请选择

          系统预设颜色

          "`; +exports[`ssr snapshot test renders ./src/color-picker/_example/recent-color.jsx correctly 1`] = `"
          预设最近使用色
          请选择

          最近使用颜色

          系统预设颜色

          完全不显示最近使用色
          请选择

          系统预设颜色

          "`; exports[`ssr snapshot test renders ./src/color-picker/_example/status-disabled.jsx correctly 1`] = `"
          #0052d9
          "`; -exports[`ssr snapshot test renders ./src/color-picker/_example/status-readonly.jsx correctly 1`] = `"
          请选择

          最近使用颜色

            系统预设颜色

            "`; +exports[`ssr snapshot test renders ./src/color-picker/_example/status-readonly.jsx correctly 1`] = `"
            请选择

            最近使用颜色

              系统预设颜色

              "`; -exports[`ssr snapshot test renders ./src/color-picker/_example/swatch-color.jsx correctly 1`] = `"
              自定义系统色
              请选择

              最近使用颜色

                系统预设颜色

                完全不显示系统色
                请选择

                最近使用颜色

                  "`; +exports[`ssr snapshot test renders ./src/color-picker/_example/swatch-color.jsx correctly 1`] = `"
                  自定义系统色
                  请选择

                  最近使用颜色

                    系统预设颜色

                    完全不显示系统色
                    请选择

                    最近使用颜色

                      "`; exports[`ssr snapshot test renders ./src/color-picker/_example/trigger.jsx correctly 1`] = `"
                      #0052d9
                      "`; @@ -238,7 +238,7 @@ exports[`ssr snapshot test renders ./src/config-provider/_example/global.jsx cor exports[`ssr snapshot test renders ./src/config-provider/_example/others.jsx correctly 1`] = `"
                      Feature Tag
                      Feature Tag
                      Feature Tag
                      Feature Tag
                      Tree Empty Data
                      First Step
                      You need to click the blue button
                      Second Step
                      Fill your base information into the form
                      Error Step
                      Something Wrong! Custom Error Icon!
                      4
                      Last Step
                      You haven't finish this step.
                      "`; -exports[`ssr snapshot test renders ./src/config-provider/_example/pagination.jsx correctly 1`] = `"
                      Total 36 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      jump to
                      / 4 页
                      "`; +exports[`ssr snapshot test renders ./src/config-provider/_example/pagination.jsx correctly 1`] = `"
                      Total 36 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      jump to
                      / 4 页
                      "`; exports[`ssr snapshot test renders ./src/config-provider/_example/popconfirm.jsx correctly 1`] = `"
                      "`; @@ -338,7 +338,7 @@ exports[`ssr snapshot test renders ./src/form/_example/clear-validate.jsx correc exports[`ssr snapshot test renders ./src/form/_example/custom-validator.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/form/_example/disabled.jsx correctly 1`] = `"
                      请选择单张图片文件上传
                      "`; +exports[`ssr snapshot test renders ./src/form/_example/disabled.jsx correctly 1`] = `"
                      请选择单张图片文件上传
                      "`; exports[`ssr snapshot test renders ./src/form/_example/error-message.jsx correctly 1`] = `"
                      这是用户名字段帮助说明
                      一句话介绍自己
                      "`; @@ -454,25 +454,27 @@ exports[`ssr snapshot test renders ./src/input-adornment/_example/select.jsx cor exports[`ssr snapshot test renders ./src/input-adornment/_example/text.jsx correctly 1`] = `"
                      http://
                      .com
                      http://
                      .com
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/align.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/align.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/auto-width.jsx correctly 1`] = `"
                      1
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/auto-width.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/center.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/center.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/default.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/default.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/format.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/format.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/left.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/large-number.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/normal.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/left.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/size.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/normal.jsx correctly 1`] = `"
                      机器:
                      金额:
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/status.jsx correctly 1`] = `"
                      这是普通文本提示
                      这是普通文本提示
                      校验通过文本提示
                      校验不通过文本提示
                      校验存在严重问题文本提示
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/size.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/input-number/_example/step.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/input-number/_example/status.jsx correctly 1`] = `"
                      这是普通文本提示
                      校验通过文本提示
                      校验不通过文本提示
                      校验存在严重问题文本提示
                      "`; + +exports[`ssr snapshot test renders ./src/input-number/_example/step.jsx correctly 1`] = `"
                      "`; exports[`ssr snapshot test renders ./src/jumper/_example/layout.jsx correctly 1`] = `"
                      "`; @@ -580,7 +582,7 @@ exports[`ssr snapshot test renders ./src/notification/_example/toggle.jsx correc exports[`ssr snapshot test renders ./src/pagination/_example/base.jsx correctly 1`] = `"
                      Total 100 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 20
                      "`; -exports[`ssr snapshot test renders ./src/pagination/_example/jump.jsx correctly 1`] = `"
                      Total 645 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 33
                      jump to
                      / 33 页
                      "`; +exports[`ssr snapshot test renders ./src/pagination/_example/jump.jsx correctly 1`] = `"
                      Total 645 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 33
                      jump to
                      / 33 页
                      "`; exports[`ssr snapshot test renders ./src/pagination/_example/mini.jsx correctly 1`] = `"
                      Total 100 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 20
                      "`; @@ -588,9 +590,9 @@ exports[`ssr snapshot test renders ./src/pagination/_example/more.jsx correctly exports[`ssr snapshot test renders ./src/pagination/_example/page-num.jsx correctly 1`] = `"
                      Total 645 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 33
                      "`; -exports[`ssr snapshot test renders ./src/pagination/_example/simple.jsx correctly 1`] = `"
                      Total 100 items
                      请选择
                      jump to
                      / 20 页
                      "`; +exports[`ssr snapshot test renders ./src/pagination/_example/simple.jsx correctly 1`] = `"
                      Total 100 items
                      请选择
                      jump to
                      / 20 页
                      "`; -exports[`ssr snapshot test renders ./src/pagination/_example/simple-mini.jsx correctly 1`] = `"
                      Total 100 items
                      请选择
                      jump to
                      / 20 页
                      "`; +exports[`ssr snapshot test renders ./src/pagination/_example/simple-mini.jsx correctly 1`] = `"
                      Total 100 items
                      请选择
                      jump to
                      / 20 页
                      "`; exports[`ssr snapshot test renders ./src/pagination/_example/total.jsx correctly 1`] = `"
                      Total 685 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 69
                      "`; @@ -622,7 +624,7 @@ exports[`ssr snapshot test renders ./src/popup/_example/dynamic.jsx correctly 1` exports[`ssr snapshot test renders ./src/popup/_example/placement.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/popup/_example/style.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/popup/_example/style.jsx correctly 1`] = `"
                      "`; exports[`ssr snapshot test renders ./src/popup/_example/trigger.jsx correctly 1`] = `"
                      "`; @@ -748,9 +750,9 @@ exports[`ssr snapshot test renders ./src/slider/_example/base.jsx correctly 1`] exports[`ssr snapshot test renders ./src/slider/_example/disabled.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/slider/_example/input-number.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/slider/_example/input-number.jsx correctly 1`] = `"
                      "`; -exports[`ssr snapshot test renders ./src/slider/_example/input-number-vertical.jsx correctly 1`] = `"
                      "`; +exports[`ssr snapshot test renders ./src/slider/_example/input-number-vertical.jsx correctly 1`] = `"
                      "`; exports[`ssr snapshot test renders ./src/slider/_example/marks.jsx correctly 1`] = `"
                      0°C
                      12°C
                      37°C
                      0°C
                      8°C
                      37°C
                      50°C
                      70°C
                      "`; @@ -816,7 +818,7 @@ exports[`ssr snapshot test renders ./src/table/_example/affix.jsx correctly 1`] exports[`ssr snapshot test renders ./src/table/_example/async-loading.jsx correctly 1`] = `"
                      集群名称
                      状态
                      管理员
                      描述
                      JQTest1

                      健康

                      jenny;petertest1
                      JQTest2

                      警告

                      jennytest2
                      JQTest3

                      健康

                      jennytest3
                      JQTest4

                      警告

                      petertest4
                      JQTest5

                      警告

                      petertest5
                      正在加载中,请稍后
                      "`; -exports[`ssr snapshot test renders ./src/table/_example/base.jsx correctly 1`] = `"
                      序号
                      平台
                      类型
                      默认值
                      是否必传
                      详情信息
                      0共有String0
                      读取 0 个数据的嵌套信息值
                      1私有Number[]
                      读取 1 个数据的嵌套信息值
                      2共有Array-
                      读取 2 个数据的嵌套信息值
                      3私有Object-
                      读取 3 个数据的嵌套信息值
                      4共有String-
                      读取 4 个数据的嵌套信息值
                      5私有Number0
                      读取 5 个数据的嵌套信息值
                      6共有Array[]
                      读取 6 个数据的嵌套信息值
                      7私有Object-
                      读取 7 个数据的嵌套信息值
                      8共有String-
                      读取 8 个数据的嵌套信息值
                      9私有Number-
                      读取 9 个数据的嵌套信息值
                      10共有Array0
                      读取 10 个数据的嵌套信息值
                      11私有Object[]
                      读取 11 个数据的嵌套信息值
                      12共有String-
                      读取 12 个数据的嵌套信息值
                      13私有Number-
                      读取 13 个数据的嵌套信息值
                      14共有Array-
                      读取 14 个数据的嵌套信息值
                      15私有Object0
                      读取 15 个数据的嵌套信息值
                      16共有String[]
                      读取 16 个数据的嵌套信息值
                      17私有Number-
                      读取 17 个数据的嵌套信息值
                      18共有Array-
                      读取 18 个数据的嵌套信息值
                      19私有Object-
                      读取 19 个数据的嵌套信息值
                      20共有String0
                      读取 20 个数据的嵌套信息值
                      21私有Number[]
                      读取 21 个数据的嵌套信息值
                      22共有Array-
                      读取 22 个数据的嵌套信息值
                      23私有Object-
                      读取 23 个数据的嵌套信息值
                      24共有String-
                      读取 24 个数据的嵌套信息值
                      25私有Number0
                      读取 25 个数据的嵌套信息值
                      26共有Array[]
                      读取 26 个数据的嵌套信息值
                      27私有Object-
                      读取 27 个数据的嵌套信息值
                      Total 28 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 6
                      jump to
                      / 6 页
                      "`; +exports[`ssr snapshot test renders ./src/table/_example/base.jsx correctly 1`] = `"
                      序号
                      平台
                      类型
                      默认值
                      是否必传
                      详情信息
                      0共有String0
                      读取 0 个数据的嵌套信息值
                      1私有Number[]
                      读取 1 个数据的嵌套信息值
                      2共有Array-
                      读取 2 个数据的嵌套信息值
                      3私有Object-
                      读取 3 个数据的嵌套信息值
                      4共有String-
                      读取 4 个数据的嵌套信息值
                      5私有Number0
                      读取 5 个数据的嵌套信息值
                      6共有Array[]
                      读取 6 个数据的嵌套信息值
                      7私有Object-
                      读取 7 个数据的嵌套信息值
                      8共有String-
                      读取 8 个数据的嵌套信息值
                      9私有Number-
                      读取 9 个数据的嵌套信息值
                      10共有Array0
                      读取 10 个数据的嵌套信息值
                      11私有Object[]
                      读取 11 个数据的嵌套信息值
                      12共有String-
                      读取 12 个数据的嵌套信息值
                      13私有Number-
                      读取 13 个数据的嵌套信息值
                      14共有Array-
                      读取 14 个数据的嵌套信息值
                      15私有Object0
                      读取 15 个数据的嵌套信息值
                      16共有String[]
                      读取 16 个数据的嵌套信息值
                      17私有Number-
                      读取 17 个数据的嵌套信息值
                      18共有Array-
                      读取 18 个数据的嵌套信息值
                      19私有Object-
                      读取 19 个数据的嵌套信息值
                      20共有String0
                      读取 20 个数据的嵌套信息值
                      21私有Number[]
                      读取 21 个数据的嵌套信息值
                      22共有Array-
                      读取 22 个数据的嵌套信息值
                      23私有Object-
                      读取 23 个数据的嵌套信息值
                      24共有String-
                      读取 24 个数据的嵌套信息值
                      25私有Number0
                      读取 25 个数据的嵌套信息值
                      26共有Array[]
                      读取 26 个数据的嵌套信息值
                      27私有Object-
                      读取 27 个数据的嵌套信息值
                      Total 28 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 6
                      jump to
                      / 6 页
                      "`; exports[`ssr snapshot test renders ./src/table/_example/custom-cell.jsx correctly 1`] = `"
                      类型
                      平台
                      属性名
                      render
                      any[]公有
                      使用 cell 方法自定义单元格:data
                      render 方法渲染单元格: 0-3
                      String公有
                      使用 cell 方法自定义单元格:rowkey
                      render 方法渲染单元格: 1-3
                      "`; @@ -844,7 +846,7 @@ exports[`ssr snapshot test renders ./src/table/_example/empty.jsx correctly 1`] exports[`ssr snapshot test renders ./src/table/_example/expandable.jsx correctly 1`] = `"
                      集群名称
                      状态
                      管理员
                      描述
                      字段 1
                      字段 2
                      字段 3
                      字段 4
                      字段 5
                      字段 6
                      操作
                      JQTest1异常jenny;peterdescriptionfield1field2field3field4field5field6管理
                      JQTest2健康jenny;peterdescriptionfield1field2field3field4field5field6管理
                      JQTest3异常jenny;peterdescriptionfield1field2field3field4field5field6管理
                      JQTest4健康jenny;peterdescriptionfield1field2field3field4field5field6管理
                      JQTest5异常jenny;peterdescriptionfield1field2field3field4field5field6管理
                      "`; -exports[`ssr snapshot test renders ./src/table/_example/filter-controlled.jsx correctly 1`] = `"
                      已选筛选条件:{}
                      集群名称
                      存活时间
                      管理员
                      区域
                      自定义过滤
                      JQTest1300jenny;peter广州2021-11-01
                      JQTest21000jenny上海2021-12-01
                      JQTest3500jenny北京2022-01-01
                      JQTest41500peter成都2022-02-01
                      JQTest5500jeff深圳2022-03-01
                      JQTest1800tony南京2022-04-01
                      Total 0 items
                      请选择
                      • 1
                      jump to
                      / 1 页
                      "`; +exports[`ssr snapshot test renders ./src/table/_example/filter-controlled.jsx correctly 1`] = `"
                      已选筛选条件:{}
                      集群名称
                      存活时间
                      管理员
                      区域
                      自定义过滤
                      JQTest1300jenny;peter广州2021-11-01
                      JQTest21000jenny上海2021-12-01
                      JQTest3500jenny北京2022-01-01
                      JQTest41500peter成都2022-02-01
                      JQTest5500jeff深圳2022-03-01
                      JQTest1800tony南京2022-04-01
                      Total 0 items
                      请选择
                      • 1
                      jump to
                      / 1 页
                      "`; exports[`ssr snapshot test renders ./src/table/_example/fixed-column.jsx correctly 1`] = `"
                      序号
                      平台
                      类型
                      默认值
                      说明
                      是否必传
                      操作
                      详情信息
                      0共有String-数据源删除
                      读取 0 个数据的嵌套信息值
                      1私有Number0数据源删除
                      读取 1 个数据的嵌套信息值
                      2共有Array[]数据源删除
                      读取 2 个数据的嵌套信息值
                      3私有Object{}数据源删除
                      读取 3 个数据的嵌套信息值
                      4共有String-数据源删除
                      读取 4 个数据的嵌套信息值
                      "`; @@ -862,9 +864,9 @@ exports[`ssr snapshot test renders ./src/table/_example/multi-header.jsx correct exports[`ssr snapshot test renders ./src/table/_example/multiple-sort.jsx correctly 1`] = `"
                      排序方式:[{"sortBy":"status","descending":true},{"sortBy":"survivalTime","descending":false}]
                      集群名称
                      状态
                      存活时间(s)
                      管理员
                      JQTest1

                      健康

                      1000jenny;peter
                      JQTest2

                      警告

                      1000jenny
                      JQTest3

                      异常

                      500jenny
                      JQTest4

                      警告

                      1500peter
                      "`; -exports[`ssr snapshot test renders ./src/table/_example/pagination.jsx correctly 1`] = `"
                      序号
                      平台
                      类型
                      默认值
                      是否必传
                      详情信息
                      0共有String-
                      读取 0 个数据的嵌套信息值
                      1私有Number0
                      读取 1 个数据的嵌套信息值
                      2共有Array[]
                      读取 2 个数据的嵌套信息值
                      3私有Object{}
                      读取 3 个数据的嵌套信息值
                      4共有String-
                      读取 4 个数据的嵌套信息值
                      5私有Number0
                      读取 5 个数据的嵌套信息值
                      6共有Array[]
                      读取 6 个数据的嵌套信息值
                      7私有Object{}
                      读取 7 个数据的嵌套信息值
                      8共有String-
                      读取 8 个数据的嵌套信息值
                      9私有Number0
                      读取 9 个数据的嵌套信息值
                      10共有Array[]
                      读取 10 个数据的嵌套信息值
                      11私有Object{}
                      读取 11 个数据的嵌套信息值
                      12共有String-
                      读取 12 个数据的嵌套信息值
                      13私有Number0
                      读取 13 个数据的嵌套信息值
                      14共有Array[]
                      读取 14 个数据的嵌套信息值
                      15私有Object{}
                      读取 15 个数据的嵌套信息值
                      16共有String-
                      读取 16 个数据的嵌套信息值
                      17私有Number0
                      读取 17 个数据的嵌套信息值
                      18共有Array[]
                      读取 18 个数据的嵌套信息值
                      19私有Object{}
                      读取 19 个数据的嵌套信息值
                      20共有String-
                      读取 20 个数据的嵌套信息值
                      21私有Number0
                      读取 21 个数据的嵌套信息值
                      22共有Array[]
                      读取 22 个数据的嵌套信息值
                      23私有Object{}
                      读取 23 个数据的嵌套信息值
                      24共有String-
                      读取 24 个数据的嵌套信息值
                      25私有Number0
                      读取 25 个数据的嵌套信息值
                      26共有Array[]
                      读取 26 个数据的嵌套信息值
                      27私有Object{}
                      读取 27 个数据的嵌套信息值
                      28共有String-
                      读取 28 个数据的嵌套信息值
                      29私有Number0
                      读取 29 个数据的嵌套信息值
                      30共有Array[]
                      读取 30 个数据的嵌套信息值
                      31私有Object{}
                      读取 31 个数据的嵌套信息值
                      32共有String-
                      读取 32 个数据的嵌套信息值
                      33私有Number0
                      读取 33 个数据的嵌套信息值
                      34共有Array[]
                      读取 34 个数据的嵌套信息值
                      35私有Object{}
                      读取 35 个数据的嵌套信息值
                      36共有String-
                      读取 36 个数据的嵌套信息值
                      37私有Number0
                      读取 37 个数据的嵌套信息值
                      38共有Array[]
                      读取 38 个数据的嵌套信息值
                      39私有Object{}
                      读取 39 个数据的嵌套信息值
                      40共有String-
                      读取 40 个数据的嵌套信息值
                      41私有Number0
                      读取 41 个数据的嵌套信息值
                      42共有Array[]
                      读取 42 个数据的嵌套信息值
                      43私有Object{}
                      读取 43 个数据的嵌套信息值
                      44共有String-
                      读取 44 个数据的嵌套信息值
                      45私有Number0
                      读取 45 个数据的嵌套信息值
                      46共有Array[]
                      读取 46 个数据的嵌套信息值
                      47私有Object{}
                      读取 47 个数据的嵌套信息值
                      48共有String-
                      读取 48 个数据的嵌套信息值
                      49私有Number0
                      读取 49 个数据的嵌套信息值
                      50共有Array[]
                      读取 50 个数据的嵌套信息值
                      51私有Object{}
                      读取 51 个数据的嵌套信息值
                      52共有String-
                      读取 52 个数据的嵌套信息值
                      53私有Number0
                      读取 53 个数据的嵌套信息值
                      54共有Array[]
                      读取 54 个数据的嵌套信息值
                      55私有Object{}
                      读取 55 个数据的嵌套信息值
                      56共有String-
                      读取 56 个数据的嵌套信息值
                      57私有Number0
                      读取 57 个数据的嵌套信息值
                      58共有Array[]
                      读取 58 个数据的嵌套信息值
                      59私有Object{}
                      读取 59 个数据的嵌套信息值
                      Total 60 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 12
                      jump to
                      / 12 页
                      "`; +exports[`ssr snapshot test renders ./src/table/_example/pagination.jsx correctly 1`] = `"
                      序号
                      平台
                      类型
                      默认值
                      是否必传
                      详情信息
                      0共有String-
                      读取 0 个数据的嵌套信息值
                      1私有Number0
                      读取 1 个数据的嵌套信息值
                      2共有Array[]
                      读取 2 个数据的嵌套信息值
                      3私有Object{}
                      读取 3 个数据的嵌套信息值
                      4共有String-
                      读取 4 个数据的嵌套信息值
                      5私有Number0
                      读取 5 个数据的嵌套信息值
                      6共有Array[]
                      读取 6 个数据的嵌套信息值
                      7私有Object{}
                      读取 7 个数据的嵌套信息值
                      8共有String-
                      读取 8 个数据的嵌套信息值
                      9私有Number0
                      读取 9 个数据的嵌套信息值
                      10共有Array[]
                      读取 10 个数据的嵌套信息值
                      11私有Object{}
                      读取 11 个数据的嵌套信息值
                      12共有String-
                      读取 12 个数据的嵌套信息值
                      13私有Number0
                      读取 13 个数据的嵌套信息值
                      14共有Array[]
                      读取 14 个数据的嵌套信息值
                      15私有Object{}
                      读取 15 个数据的嵌套信息值
                      16共有String-
                      读取 16 个数据的嵌套信息值
                      17私有Number0
                      读取 17 个数据的嵌套信息值
                      18共有Array[]
                      读取 18 个数据的嵌套信息值
                      19私有Object{}
                      读取 19 个数据的嵌套信息值
                      20共有String-
                      读取 20 个数据的嵌套信息值
                      21私有Number0
                      读取 21 个数据的嵌套信息值
                      22共有Array[]
                      读取 22 个数据的嵌套信息值
                      23私有Object{}
                      读取 23 个数据的嵌套信息值
                      24共有String-
                      读取 24 个数据的嵌套信息值
                      25私有Number0
                      读取 25 个数据的嵌套信息值
                      26共有Array[]
                      读取 26 个数据的嵌套信息值
                      27私有Object{}
                      读取 27 个数据的嵌套信息值
                      28共有String-
                      读取 28 个数据的嵌套信息值
                      29私有Number0
                      读取 29 个数据的嵌套信息值
                      30共有Array[]
                      读取 30 个数据的嵌套信息值
                      31私有Object{}
                      读取 31 个数据的嵌套信息值
                      32共有String-
                      读取 32 个数据的嵌套信息值
                      33私有Number0
                      读取 33 个数据的嵌套信息值
                      34共有Array[]
                      读取 34 个数据的嵌套信息值
                      35私有Object{}
                      读取 35 个数据的嵌套信息值
                      36共有String-
                      读取 36 个数据的嵌套信息值
                      37私有Number0
                      读取 37 个数据的嵌套信息值
                      38共有Array[]
                      读取 38 个数据的嵌套信息值
                      39私有Object{}
                      读取 39 个数据的嵌套信息值
                      40共有String-
                      读取 40 个数据的嵌套信息值
                      41私有Number0
                      读取 41 个数据的嵌套信息值
                      42共有Array[]
                      读取 42 个数据的嵌套信息值
                      43私有Object{}
                      读取 43 个数据的嵌套信息值
                      44共有String-
                      读取 44 个数据的嵌套信息值
                      45私有Number0
                      读取 45 个数据的嵌套信息值
                      46共有Array[]
                      读取 46 个数据的嵌套信息值
                      47私有Object{}
                      读取 47 个数据的嵌套信息值
                      48共有String-
                      读取 48 个数据的嵌套信息值
                      49私有Number0
                      读取 49 个数据的嵌套信息值
                      50共有Array[]
                      读取 50 个数据的嵌套信息值
                      51私有Object{}
                      读取 51 个数据的嵌套信息值
                      52共有String-
                      读取 52 个数据的嵌套信息值
                      53私有Number0
                      读取 53 个数据的嵌套信息值
                      54共有Array[]
                      读取 54 个数据的嵌套信息值
                      55私有Object{}
                      读取 55 个数据的嵌套信息值
                      56共有String-
                      读取 56 个数据的嵌套信息值
                      57私有Number0
                      读取 57 个数据的嵌套信息值
                      58共有Array[]
                      读取 58 个数据的嵌套信息值
                      59私有Object{}
                      读取 59 个数据的嵌套信息值
                      Total 60 items
                      请选择
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 12
                      jump to
                      / 12 页
                      "`; -exports[`ssr snapshot test renders ./src/table/_example/pagination-ajax.jsx correctly 1`] = `"
                      UNKNOWN_USER
                      性别
                      邮箱
                      Empty Data
                      Total 0 items
                      请选择
                      • 1
                      jump to
                      / 1 页
                      "`; +exports[`ssr snapshot test renders ./src/table/_example/pagination-ajax.jsx correctly 1`] = `"
                      UNKNOWN_USER
                      性别
                      邮箱
                      Empty Data
                      Total 0 items
                      请选择
                      • 1
                      jump to
                      / 1 页
                      "`; exports[`ssr snapshot test renders ./src/table/_example/select-multiple.jsx correctly 1`] = `"
                      集群名称
                      状态
                      管理员
                      描述
                      操作
                      JQTest1

                      健康

                      jenny;petertest
                      JQTest2

                      异常

                      jennytest
                      JQTest3

                      健康

                      jennytest
                      JQTest4

                      异常

                      petertest
                      "`; @@ -980,7 +982,7 @@ exports[`ssr snapshot test renders ./src/transfer/_example/custom-render.jsx cor exports[`ssr snapshot test renders ./src/transfer/_example/empty.jsx correctly 1`] = `"

                      默认暂无数据

                      0 / 0
                      Empty Data
                      0 / 0
                      Empty Data

                      自定义暂无数据

                      0 / 0
                      No Source
                      0 / 0
                      No Target
                      "`; -exports[`ssr snapshot test renders ./src/transfer/_example/pagination.jsx correctly 1`] = `"
                      0 / 20
                      jump to
                      / 2 页
                      0 / 0
                      Empty Data
                      jump to
                      / 1 页
                      "`; +exports[`ssr snapshot test renders ./src/transfer/_example/pagination.jsx correctly 1`] = `"
                      0 / 20
                      jump to
                      / 2 页
                      0 / 0
                      Empty Data
                      jump to
                      / 1 页
                      "`; exports[`ssr snapshot test renders ./src/transfer/_example/search.jsx correctly 1`] = `"
                      0 / 20
                      0 / 0
                      Empty Data
                      "`;