mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-02 20:19:44 +08:00
parent
c9be66f8e7
commit
c8a1442e38
@ -6,7 +6,7 @@ import Button from '../button';
|
||||
|
||||
export interface SearchProps extends InputProps {
|
||||
inputPrefixCls?: string;
|
||||
onSearch?: (value: string) => any;
|
||||
onSearch?: (value: string, event?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLInputElement>) => any;
|
||||
enterButton?: boolean | React.ReactNode;
|
||||
}
|
||||
|
||||
@ -19,10 +19,10 @@ export default class Search extends React.Component<SearchProps, any> {
|
||||
|
||||
private input: Input;
|
||||
|
||||
onSearch = () => {
|
||||
onSearch = (e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLInputElement>) => {
|
||||
const { onSearch } = this.props;
|
||||
if (onSearch) {
|
||||
onSearch(this.input.input.value);
|
||||
onSearch(this.input.input.value, e);
|
||||
}
|
||||
this.input.focus();
|
||||
}
|
||||
|
@ -35,7 +35,10 @@ describe('Input.Search', () => {
|
||||
);
|
||||
wrapper.find('Icon').simulate('click');
|
||||
expect(onSearch).toHaveBeenCalledTimes(1);
|
||||
expect(onSearch).toBeCalledWith('search text');
|
||||
expect(onSearch).toBeCalledWith('search text', expect.objectContaining({
|
||||
type: 'click',
|
||||
preventDefault: expect.any(Function),
|
||||
}));
|
||||
});
|
||||
|
||||
it('should trigger onSearch when click search button', () => {
|
||||
@ -45,7 +48,10 @@ describe('Input.Search', () => {
|
||||
);
|
||||
wrapper.find('Button').simulate('click');
|
||||
expect(onSearch).toHaveBeenCalledTimes(1);
|
||||
expect(onSearch).toBeCalledWith('search text');
|
||||
expect(onSearch).toBeCalledWith('search text', expect.objectContaining({
|
||||
type: 'click',
|
||||
preventDefault: expect.any(Function),
|
||||
}));
|
||||
});
|
||||
|
||||
it('should trigger onSearch when click search button with text', () => {
|
||||
@ -55,7 +61,10 @@ describe('Input.Search', () => {
|
||||
);
|
||||
wrapper.find('Button').simulate('click');
|
||||
expect(onSearch).toHaveBeenCalledTimes(1);
|
||||
expect(onSearch).toBeCalledWith('search text');
|
||||
expect(onSearch).toBeCalledWith('search text', expect.objectContaining({
|
||||
type: 'click',
|
||||
preventDefault: expect.any(Function),
|
||||
}));
|
||||
});
|
||||
|
||||
it('should trigger onSearch when click search button with customize button', () => {
|
||||
@ -65,7 +74,10 @@ describe('Input.Search', () => {
|
||||
);
|
||||
wrapper.find('Button').simulate('click');
|
||||
expect(onSearch).toHaveBeenCalledTimes(1);
|
||||
expect(onSearch).toBeCalledWith('search text');
|
||||
expect(onSearch).toBeCalledWith('search text', expect.objectContaining({
|
||||
type: 'click',
|
||||
preventDefault: expect.any(Function),
|
||||
}));
|
||||
});
|
||||
|
||||
it('should trigger onSearch when click search button of native', () => {
|
||||
@ -75,7 +87,10 @@ describe('Input.Search', () => {
|
||||
);
|
||||
wrapper.find('button').simulate('click');
|
||||
expect(onSearch).toHaveBeenCalledTimes(1);
|
||||
expect(onSearch).toBeCalledWith('search text');
|
||||
expect(onSearch).toBeCalledWith('search text', expect.objectContaining({
|
||||
type: 'click',
|
||||
preventDefault: expect.any(Function),
|
||||
}));
|
||||
});
|
||||
|
||||
it('should trigger onSearch when press enter', () => {
|
||||
@ -85,6 +100,9 @@ describe('Input.Search', () => {
|
||||
);
|
||||
wrapper.find('input').simulate('keydown', { key: 'Enter', keyCode: 13 });
|
||||
expect(onSearch).toHaveBeenCalledTimes(1);
|
||||
expect(onSearch).toBeCalledWith('search text');
|
||||
expect(onSearch).toBeCalledWith('search text', expect.objectContaining({
|
||||
type: 'keydown',
|
||||
preventDefault: expect.any(Function),
|
||||
}));
|
||||
});
|
||||
});
|
||||
|
@ -55,7 +55,7 @@ The rest of the props of `Input.TextArea` are the same as the original [textarea
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ----------- | ---- | ------- |
|
||||
| enterButton | to show a enter button after input | boolean\|ReactNode | false |
|
||||
| onSearch | The callback function that is triggered when you click on the search-icon or press Enter key. | function(value) | |
|
||||
| onSearch | The callback function that is triggered when you click on the search-icon or press Enter key. | function(value, event) | |
|
||||
|
||||
Supports all props of `Input`.
|
||||
|
||||
|
@ -52,7 +52,7 @@ Input 的其他属性和 React 自带的 [input](https://facebook.github.io/reac
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| enterButton | 是否有确认按钮,可设为按钮文字 | boolean\|ReactNode | false |
|
||||
| onSearch | 点击搜索或按下回车键时的回调 | function(value) | |
|
||||
| onSearch | 点击搜索或按下回车键时的回调 | function(value, event) | |
|
||||
|
||||
其余属性和 Input 一致。
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user