mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-11-30 02:59:04 +08:00
Merge pull request #22998 from ant-design/master
chore: Feature merge master
This commit is contained in:
二货机器人
GitHub
commit
77dd5af0eb
@ -10,7 +10,7 @@
|
||||
|
||||
An enterprise-class UI design language and React UI library.
|
||||
|
||||
[![CircleCI status][circleci-image]][circleci-url] [![CI status][github-action-image]][github-action-url] [![NPM version][npm-image]][npm-url] [![NPM downloads][download-image]][download-url]
|
||||
[![CircleCI status][circleci-image]][circleci-url] [![CI status][github-action-image]][github-action-url] [![codecov][codecov-image]][codecov-url] [![NPM version][npm-image]][npm-url] [![NPM downloads][download-image]][download-url]
|
||||
|
||||
[![david deps][david-image]][david-url] [![david devDeps][david-dev-image]][david-dev-url] [![Total alerts][lgtm-image]][lgtm-url] [![FOSSA Status][fossa-image]][fossa-url] [![Issues need help][help-wanted-image]][help-wanted-url]
|
||||
|
||||
|
||||
@ -9,8 +9,11 @@ import Wave from '../wave';
|
||||
import TransButton from '../transButton';
|
||||
import openAnimation from '../openAnimation';
|
||||
import { sleep } from '../../../tests/utils';
|
||||
import focusTest from '../../../tests/shared/focusTest';
|
||||
|
||||
describe('Test utils function', () => {
|
||||
focusTest(TransButton);
|
||||
|
||||
it('throttle function should work', async () => {
|
||||
const callback = jest.fn();
|
||||
const throttled = throttleByAnimationFrame(callback);
|
||||
|
||||
@ -8,6 +8,7 @@ import KeyCode from 'rc-util/lib/KeyCode';
|
||||
interface TransButtonProps extends React.HTMLAttributes<HTMLDivElement> {
|
||||
onClick?: (e?: React.MouseEvent<HTMLDivElement>) => void;
|
||||
noStyle?: boolean;
|
||||
autoFocus?: boolean;
|
||||
}
|
||||
|
||||
const inlineStyle: React.CSSProperties = {
|
||||
@ -23,6 +24,13 @@ class TransButton extends React.Component<TransButtonProps> {
|
||||
|
||||
lastKeyCode?: number;
|
||||
|
||||
componentDidMount() {
|
||||
const { autoFocus } = this.props;
|
||||
if (autoFocus) {
|
||||
this.focus();
|
||||
}
|
||||
}
|
||||
|
||||
onKeyDown: React.KeyboardEventHandler<HTMLDivElement> = event => {
|
||||
const { keyCode } = event;
|
||||
if (keyCode === KeyCode.ENTER) {
|
||||
|
||||
@ -274,7 +274,7 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
|
||||
}
|
||||
};
|
||||
|
||||
renderAnchor = ({ getPrefixCls }: ConfigConsumerProps) => {
|
||||
renderAnchor = ({ getPrefixCls, direction }: ConfigConsumerProps) => {
|
||||
const {
|
||||
prefixCls: customizePrefixCls,
|
||||
className = '',
|
||||
@ -298,7 +298,9 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
|
||||
visible: activeLink,
|
||||
});
|
||||
|
||||
const wrapperClass = classNames(className, `${prefixCls}-wrapper`);
|
||||
const wrapperClass = classNames(className, `${prefixCls}-wrapper`, {
|
||||
[`${prefixCls}-rtl`]: direction === 'rtl',
|
||||
});
|
||||
|
||||
const anchorClass = classNames(prefixCls, {
|
||||
fixed: !affix && !showInkInFixed,
|
||||
|
||||
@ -80,3 +80,5 @@
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
@import './rtl';
|
||||
|
||||
40
components/anchor/style/rtl.less
Normal file
40
components/anchor/style/rtl.less
Normal file
@ -0,0 +1,40 @@
|
||||
@import '../../style/themes/index';
|
||||
@import '../../style/mixins/index';
|
||||
|
||||
@anchor-border-width: 2px;
|
||||
|
||||
.@{ant-prefix}-anchor {
|
||||
&-rtl {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
&-wrapper {
|
||||
.@{ant-prefix}-anchor-rtl& {
|
||||
margin-right: -4px;
|
||||
margin-left: 0;
|
||||
padding-right: 4px;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&-ink {
|
||||
.@{ant-prefix}-anchor-rtl & {
|
||||
right: 0;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
&-ball {
|
||||
.@{ant-prefix}-anchor-rtl & {
|
||||
right: 50%;
|
||||
left: 0;
|
||||
transform: translateX(50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-link {
|
||||
.@{ant-prefix}-anchor-rtl & {
|
||||
padding: 7px 16px 7px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -67,30 +67,30 @@ const validateMessages = {
|
||||
|
||||
Form field component for data bidirectional binding, validation, layout, and so on.
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| --- | --- | --- | --- |
|
||||
| colon | Used with `label`, whether to display `:` after label text. | boolean | true |
|
||||
| dependencies | Set the dependency field. See [below](#dependencies) | [NamePath](#NamePath)[] | - |
|
||||
| extra | The extra prompt message. It is similar to help. Usage example: to display error message and prompt message at the same time | string\|ReactNode | - |
|
||||
| getValueFromEvent | Specify how to get value from event or other onChange arguments | (..args: any[]) => any | - |
|
||||
| hasFeedback | Used with `validateStatus`, this option specifies the validation status icon. Recommended to be used only with `Input` | boolean | false |
|
||||
| help | The prompt message. If not provided, the prompt message will be generated by the validation rule. | string\|ReactNode | - |
|
||||
| htmlFor | Set sub label `htmlFor` | string | - |
|
||||
| noStyle | No style for `true`, used as a pure field control | boolean | false |
|
||||
| label | Label text | string\|ReactNode | - |
|
||||
| labelAlign | text align of label | `left` \| `right` | `right` |
|
||||
| labelCol | The layout of label. You can set `span` `offset` to something like `{span: 3, offset: 12}` or `sm: {span: 3, offset: 12}` same as with `<Col>`. You can set `labelCol` on Form. If both exists, use Item first | [object](/components/grid/#Col) | - |
|
||||
| name | Field name, support array | [NamePath](#NamePath) | - |
|
||||
| normalize | Normalize value to form component | (value, prevValue, prevValues) => any | - |
|
||||
| required | Whether provided or not, it will be generated by the validation rule | boolean | false |
|
||||
| rules | Rules for field validation. Click [here](#components-form-demo-basic) to see an example | [Rule](#Rule)[] | - |
|
||||
| shouldUpdate | Custom field update logic. See [below](#shouldUpdate) | boolean \| (prevValue, curValue) => boolean | false |
|
||||
| trigger | When to collect the value of children node | string | onChange |
|
||||
| validateFirst | Whether stop validate on first rule of error for this field | boolean | false |
|
||||
| validateStatus | The validation status. If not provided, it will be generated by validation rule. options: 'success' 'warning' 'error' 'validating' | string | - |
|
||||
| validateTrigger | When to validate the value of children node | string \| string[] | onChange |
|
||||
| valuePropName | Props of children node, for example, the prop of Switch is 'checked' | string | 'value' |
|
||||
| wrapperCol | The layout for input controls, same as `labelCol`. You can set `wrapperCol` on Form. If both exists, use Item first | [object](/components/grid/#Col) | - |
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| colon | Used with `label`, whether to display `:` after label text. | boolean | true | |
|
||||
| dependencies | Set the dependency field. See [below](#dependencies) | [NamePath](#NamePath)[] | - | |
|
||||
| extra | The extra prompt message. It is similar to help. Usage example: to display error message and prompt message at the same time | string\|ReactNode | - | |
|
||||
| getValueFromEvent | Specify how to get value from event or other onChange arguments | (..args: any[]) => any | - | |
|
||||
| hasFeedback | Used with `validateStatus`, this option specifies the validation status icon. Recommended to be used only with `Input` | boolean | false | |
|
||||
| help | The prompt message. If not provided, the prompt message will be generated by the validation rule. | string\|ReactNode | - | |
|
||||
| htmlFor | Set sub label `htmlFor` | string | - | |
|
||||
| noStyle | No style for `true`, used as a pure field control | boolean | false | |
|
||||
| label | Label text | string\|ReactNode | - | |
|
||||
| labelAlign | text align of label | `left` \| `right` | `right` | |
|
||||
| labelCol | The layout of label. You can set `span` `offset` to something like `{span: 3, offset: 12}` or `sm: {span: 3, offset: 12}` same as with `<Col>`. You can set `labelCol` on Form. If both exists, use Item first | [object](/components/grid/#Col) | - | |
|
||||
| name | Field name, support array | [NamePath](#NamePath) | - | |
|
||||
| normalize | Normalize value to form component | (value, prevValue, prevValues) => any | - | |
|
||||
| required | Whether provided or not, it will be generated by the validation rule | boolean | false | |
|
||||
| rules | Rules for field validation. Click [here](#components-form-demo-basic) to see an example | [Rule](#Rule)[] | - | |
|
||||
| shouldUpdate | Custom field update logic. See [below](#shouldUpdate) | boolean \| (prevValue, curValue) => boolean | false | |
|
||||
| trigger | When to collect the value of children node | string | onChange | |
|
||||
| validateFirst | Whether stop validate on first rule of error for this field | boolean | false | |
|
||||
| validateStatus | The validation status. If not provided, it will be generated by validation rule. options: 'success' 'warning' 'error' 'validating' | string | - | |
|
||||
| validateTrigger | When to validate the value of children node | string \| string[] | onChange | |
|
||||
| valuePropName | Props of children node, for example, the prop of Switch is 'checked' | string | 'value' | |
|
||||
| wrapperCol | The layout for input controls, same as `labelCol`. You can set `wrapperCol` on Form. If both exists, use Item first | [object](/components/grid/#Col) | - | |
|
||||
|
||||
After wrapped by `Form.Item` with `name` property, `value`(or other property defined by `valuePropName`) `onChange`(or other property defined by `trigger`) props will be added to form controls, the flow of form data will be handled by Form which will cause:
|
||||
|
||||
|
||||
@ -68,30 +68,30 @@ const validateMessages = {
|
||||
|
||||
表单字段组件，用于数据双向绑定、校验、布局等。
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| colon | 配合 `label` 属性使用，表示是否显示 `label` 后面的冒号 | boolean | true |
|
||||
| dependencies | 设置依赖字段，说明[见下](#dependencies) | [NamePath](#NamePath)[] | - |
|
||||
| extra | 额外的提示信息，和 `help` 类似，当需要错误信息和提示文案同时出现时，可以使用这个。 | string\|ReactNode | - |
|
||||
| getValueFromEvent | 设置如何将 event 的值转换成字段值 | (..args: any[]) => any | - |
|
||||
| hasFeedback | 配合 `validateStatus` 属性使用，展示校验状态图标，建议只配合 Input 组件使用 | boolean | false |
|
||||
| help | 提示信息，如不设置，则会根据校验规则自动生成 | string\|ReactNode | - |
|
||||
| htmlFor | 设置子元素 label `htmlFor` 属性 | string | - |
|
||||
| noStyle | 为 `true` 时不带样式，作为纯字段控件使用 | boolean | false |
|
||||
| label | `label` 标签的文本 | string\|ReactNode | - |
|
||||
| labelAlign | 标签文本对齐方式 | `left` \| `right` | `right` |
|
||||
| labelCol | `label` 标签布局，同 `<Col>` 组件，设置 `span` `offset` 值，如 `{span: 3, offset: 12}` 或 `sm: {span: 3, offset: 12}`。你可以通过 Form 的 `labelCol` 进行统一设置。当和 Form 同时设置时，以 Item 为准 | [object](/components/grid/#Col) | - |
|
||||
| name | 字段名，支持数组 | [NamePath](#NamePath) | - |
|
||||
| normalize | 转换字段值给控件 | (value, prevValue, prevValues) => any | - |
|
||||
| required | 是否必填，如不设置，则会根据校验规则自动生成 | boolean | false |
|
||||
| rules | 校验规则，设置字段的校验逻辑。点击[此处](#components-form-demo-basic)查看示例 | [Rule](#Rule)[] | - |
|
||||
| shouldUpdate | 自定义字段更新逻辑，说明[见下](#shouldUpdate) | boolean \| (prevValue, curValue) => boolean | false |
|
||||
| trigger | 设置收集字段值变更的时机 | string | onChange |
|
||||
| validateFirst | 当某一规则校验不通过时，是否停止剩下的规则的校验 | boolean | false |
|
||||
| validateStatus | 校验状态，如不设置，则会根据校验规则自动生成，可选：'success' 'warning' 'error' 'validating' | string | - |
|
||||
| validateTrigger | 设置字段校验的时机 | string \| string[] | onChange |
|
||||
| valuePropName | 子节点的值的属性，如 Switch 的是 'checked' | string | 'value' |
|
||||
| wrapperCol | 需要为输入控件设置布局样式时，使用该属性，用法同 `labelCol`。你可以通过 Form 的 `wrapperCol` 进行统一设置。当和 Form 同时设置时，以 Item 为准。 | [object](/components/grid/#Col) | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| colon | 配合 `label` 属性使用，表示是否显示 `label` 后面的冒号 | boolean | true | |
|
||||
| dependencies | 设置依赖字段，说明[见下](#dependencies) | [NamePath](#NamePath)[] | - | |
|
||||
| extra | 额外的提示信息，和 `help` 类似，当需要错误信息和提示文案同时出现时，可以使用这个。 | string\|ReactNode | - | |
|
||||
| getValueFromEvent | 设置如何将 event 的值转换成字段值 | (..args: any[]) => any | - | |
|
||||
| hasFeedback | 配合 `validateStatus` 属性使用，展示校验状态图标，建议只配合 Input 组件使用 | boolean | false | |
|
||||
| help | 提示信息，如不设置，则会根据校验规则自动生成 | string\|ReactNode | - | |
|
||||
| htmlFor | 设置子元素 label `htmlFor` 属性 | string | - | |
|
||||
| noStyle | 为 `true` 时不带样式，作为纯字段控件使用 | boolean | false | |
|
||||
| label | `label` 标签的文本 | string\|ReactNode | - | |
|
||||
| labelAlign | 标签文本对齐方式 | `left` \| `right` | `right` | |
|
||||
| labelCol | `label` 标签布局，同 `<Col>` 组件，设置 `span` `offset` 值，如 `{span: 3, offset: 12}` 或 `sm: {span: 3, offset: 12}`。你可以通过 Form 的 `labelCol` 进行统一设置。当和 Form 同时设置时，以 Item 为准 | [object](/components/grid/#Col) | - | |
|
||||
| name | 字段名，支持数组 | [NamePath](#NamePath) | - | |
|
||||
| normalize | 转换字段值给控件 | (value, prevValue, prevValues) => any | - | |
|
||||
| required | 是否必填，如不设置，则会根据校验规则自动生成 | boolean | false | |
|
||||
| rules | 校验规则，设置字段的校验逻辑。点击[此处](#components-form-demo-basic)查看示例 | [Rule](#Rule)[] | - | |
|
||||
| shouldUpdate | 自定义字段更新逻辑，说明[见下](#shouldUpdate) | boolean \| (prevValue, curValue) => boolean | false | |
|
||||
| trigger | 设置收集字段值变更的时机 | string | onChange | |
|
||||
| validateFirst | 当某一规则校验不通过时，是否停止剩下的规则的校验 | boolean | false | |
|
||||
| validateStatus | 校验状态，如不设置，则会根据校验规则自动生成，可选：'success' 'warning' 'error' 'validating' | string | - | |
|
||||
| validateTrigger | 设置字段校验的时机 | string \| string[] | onChange | |
|
||||
| valuePropName | 子节点的值的属性，如 Switch 的是 'checked' | string | 'value' | |
|
||||
| wrapperCol | 需要为输入控件设置布局样式时，使用该属性，用法同 `labelCol`。你可以通过 Form 的 `wrapperCol` 进行统一设置。当和 Form 同时设置时，以 Item 为准。 | [object](/components/grid/#Col) | - | |
|
||||
|
||||
被设置了 `name` 属性的 `Form.Item` 包装的控件，表单控件会自动添加 `value`（或 `valuePropName` 指定的其他属性） `onChange`（或 `trigger` 指定的其他属性），数据同步将被 Form 接管，这会导致以下结果：
|
||||
|
||||
|
||||
@ -300,12 +300,16 @@
|
||||
}
|
||||
|
||||
& > * {
|
||||
display: inline-flex;
|
||||
display: inline-block;
|
||||
float: none;
|
||||
vertical-align: top; // https://github.com/ant-design/ant-design-pro/issues/139
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
& > .@{inputClass}-affix-wrapper {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
& > *:not(:last-child) {
|
||||
margin-right: -@border-width-base;
|
||||
border-right-width: @border-width-base;
|
||||
|
||||
@ -49,7 +49,11 @@ class SubMenu extends React.Component<SubMenuProps, any> {
|
||||
<RcSubMenu
|
||||
{...this.props}
|
||||
ref={this.saveSubMenu}
|
||||
popupClassName={classNames(`${rootPrefixCls}-${antdMenuTheme}`, popupClassName)}
|
||||
popupClassName={classNames(
|
||||
rootPrefixCls,
|
||||
`${rootPrefixCls}-${antdMenuTheme}`,
|
||||
popupClassName,
|
||||
)}
|
||||
/>
|
||||
)}
|
||||
</MenuContext.Consumer>
|
||||
|
||||
@ -12,18 +12,17 @@ export interface ActionButtonProps {
|
||||
}
|
||||
|
||||
export interface ActionButtonState {
|
||||
loading: boolean;
|
||||
loading: ButtonProps['loading'];
|
||||
}
|
||||
|
||||
export default class ActionButton extends React.Component<ActionButtonProps, ActionButtonState> {
|
||||
timeoutId: number;
|
||||
|
||||
constructor(props: ActionButtonProps) {
|
||||
super(props);
|
||||
this.state = {
|
||||
loading: false,
|
||||
};
|
||||
}
|
||||
clicked: boolean;
|
||||
|
||||
state = {
|
||||
loading: false,
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
if (this.props.autoFocus) {
|
||||
@ -38,6 +37,10 @@ export default class ActionButton extends React.Component<ActionButtonProps, Act
|
||||
|
||||
onClick = () => {
|
||||
const { actionFn, closeModal } = this.props;
|
||||
if (this.clicked) {
|
||||
return;
|
||||
}
|
||||
this.clicked = true;
|
||||
if (actionFn) {
|
||||
let ret;
|
||||
if (actionFn.length) {
|
||||
@ -62,6 +65,7 @@ export default class ActionButton extends React.Component<ActionButtonProps, Act
|
||||
console.error(e);
|
||||
// See: https://github.com/ant-design/ant-design/issues/6183
|
||||
this.setState({ loading: false });
|
||||
this.clicked = false;
|
||||
},
|
||||
);
|
||||
}
|
||||
@ -74,7 +78,12 @@ export default class ActionButton extends React.Component<ActionButtonProps, Act
|
||||
const { type, children, buttonProps } = this.props;
|
||||
const { loading } = this.state;
|
||||
return (
|
||||
<Button type={type} onClick={this.onClick} loading={loading} {...buttonProps}>
|
||||
<Button
|
||||
type={type}
|
||||
onClick={this.onClick}
|
||||
loading={loading}
|
||||
{...buttonProps}
|
||||
>
|
||||
{children}
|
||||
</Button>
|
||||
);
|
||||
|
||||
@ -231,4 +231,13 @@ describe('Modal.confirm triggers callbacks correctly', () => {
|
||||
);
|
||||
warnSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('ok button should trigger onOk once when click it many times quickly', () => {
|
||||
const onOk = jest.fn();
|
||||
open({ onOk });
|
||||
// Fifth Modal
|
||||
$$('.ant-btn-primary')[0].click();
|
||||
$$('.ant-btn-primary')[0].click();
|
||||
expect(onOk).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
});
|
||||
|
||||
@ -112,6 +112,11 @@
|
||||
white-space: nowrap;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
// https://github.com/ant-design/ant-design/issues/22906
|
||||
&:first-child .@{select-prefix-cls}-selection-search-input {
|
||||
margin-left: 6.5px;
|
||||
}
|
||||
}
|
||||
|
||||
// ======================= Placeholder =======================
|
||||
@ -144,6 +149,7 @@
|
||||
|
||||
.@{select-prefix-cls}-selection-search {
|
||||
height: @select-selection-height + @select-multiple-padding;
|
||||
line-height: @select-selection-height + @select-multiple-padding;
|
||||
|
||||
&-input,
|
||||
&-mirror {
|
||||
@ -162,6 +168,10 @@
|
||||
.@{select-prefix-cls}-selection-placeholder {
|
||||
left: @input-padding-horizontal-sm;
|
||||
}
|
||||
// https://github.com/ant-design/ant-design/issues/22906
|
||||
.@{select-prefix-cls}-selection-search:first-child .@{select-prefix-cls}-selection-search-input {
|
||||
margin-left: 3px;
|
||||
}
|
||||
}
|
||||
&.@{select-prefix-cls}-lg {
|
||||
.@{select-prefix-cls}-selection-item {
|
||||
|
||||
@ -28,7 +28,8 @@
|
||||
// ========================== Popup ==========================
|
||||
&-dropdown {
|
||||
&-rtl {
|
||||
direction: rtl;
|
||||
direction: ltr;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -70,7 +70,7 @@ We provide `antd.js` `antd.css` and `antd.min.js` `antd.min.css` under `antd/dis
|
||||
|
||||
> **We strongly discourage loading the entire files** this will add bloat to your application and make it more difficult to receive bugfixes and updates. Antd is intended to be used in conjunction with a build tool, such as [webpack](https://webpack.github.io/), which will make it easy to import only the parts of antd that you are using.
|
||||
|
||||
> Note: you should import moment before using antd.js after `3.0`.
|
||||
> Note: you should import react/react-dom/moment before using antd.js.
|
||||
|
||||
## Usage
|
||||
|
||||
|
||||
@ -70,7 +70,7 @@ $ yarn add antd
|
||||
|
||||
> **强烈不推荐使用已构建文件**，这样无法按需加载，而且难以获得底层依赖模块的 bug 快速修复支持。
|
||||
|
||||
> 注意：3.0 之后引入 antd.js 前你需要自行引入 [moment](http://momentjs.com/)。
|
||||
> 注意：antd.js 依赖 react/react-dom/moment，请确保提前引入这些文件。
|
||||
|
||||
## 示例
|
||||
|
||||
|
||||
@ -9,8 +9,8 @@ title: 从 v3 到 v4
|
||||
|
||||
1. 请先升级到 3.x 的最新版本，按照控制台 warning 信息移除/修改相关的 API。
|
||||
2. 升级项目 React 16.12.0 以上。
|
||||
- 如果你仍在使用 React 15，请参考[React 16 升级文档](https://reactjs.org/blog/2017/09/26/react-v16.0.html#breaking-changes)
|
||||
- 其余 React 16 废弃生命周期 API 请参考 [迁移导引](https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path)
|
||||
- 如果你仍在使用 React 15，请参考 [React 16 升级文档](https://reactjs.org/blog/2017/09/26/react-v16.0.html#breaking-changes)。
|
||||
- 其余 React 16 废弃生命周期 API 请参考 [迁移导引](https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path)。
|
||||
|
||||
## 4.0 有哪些不兼容的变化
|
||||
|
||||
|
||||
@ -110,7 +110,7 @@ class IconDisplay extends React.Component<IconDisplayProps, IconDisplayState> {
|
||||
</Radio.Group>
|
||||
<Input.Search
|
||||
placeholder={messages['app.docs.components.icon.search.placeholder']}
|
||||
style={{ marginLeft: 10, flex: 1 }}
|
||||
style={{ margin: '0 10px', flex: 1 }}
|
||||
allowClear
|
||||
onChange={e => this.handleSearchIcon(e.currentTarget.value)}
|
||||
size="large"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user