fix: backspace should delete character in Cascader[showSearch], close: #5340 (#5513)

This commit is contained in:
Benjy Cui 2017-03-28 13:51:58 +08:00 committed by 偏右
parent ae9e02a6c3
commit 59f805d323
2 changed files with 18 additions and 1 deletions

View File

@ -1,6 +1,7 @@
import React from 'react';
import { render, mount } from 'enzyme';
import { renderToJson } from 'enzyme-to-json';
import KeyCode from 'rc-util/lib/KeyCode';
import Cascader from '..';
const options = [{
@ -51,7 +52,6 @@ describe('Cascader', () => {
expect(renderToJson(render(wrapper.find('Trigger').node.getComponent()))).toMatchSnapshot();
});
it('can be selected', () => {
const wrapper = mount(<Cascader options={options} />);
wrapper.find('input').simulate('click');
@ -68,4 +68,13 @@ describe('Cascader', () => {
.simulate('click');
expect(renderToJson(render(wrapper.find('Trigger').node.getComponent()))).toMatchSnapshot();
});
it('backspace should work with `Cascader[showSearch]`', () => {
const wrapper = mount(<Cascader options={options} showSearch />);
wrapper.find('input').simulate('change', { target: { value: '123' } });
expect(wrapper.state('inputValue')).toBe('123');
wrapper.find('input').simulate('keydown', { keyCode: KeyCode.BACKSPACE });
// Simulate onKeyDown will not trigger onChange by default, so the value is still '123'
expect(wrapper.state('inputValue')).toBe('123');
});
});

View File

@ -3,6 +3,7 @@ import RcCascader from 'rc-cascader';
import arrayTreeFilter from 'array-tree-filter';
import classNames from 'classnames';
import omit from 'omit.js';
import KeyCode from 'rc-util/lib/KeyCode';
import Input from '../input';
import Icon from '../icon';
@ -172,6 +173,12 @@ export default class Cascader extends React.Component<CascaderProps, any> {
}
}
handleKeyDown = (e) => {
if (e.keyCode === KeyCode.BACKSPACE) {
e.stopPropagation();
}
}
handleInputChange = (e) => {
const inputValue = e.target.value;
this.setState({ inputValue });
@ -334,6 +341,7 @@ export default class Cascader extends React.Component<CascaderProps, any> {
autoComplete="off"
onClick={showSearch ? this.handleInputClick : undefined}
onBlur={showSearch ? this.handleInputBlur : undefined}
onKeyDown={this.handleKeyDown}
onChange={showSearch ? this.handleInputChange : undefined}
/>
<span className={`${prefixCls}-picker-label`}>