[breaking change] Field: renaming icon props、events

This commit is contained in:
陈嘉涵 2019-04-29 14:49:30 +08:00
parent 1c5c5eaf73
commit 706f047909
4 changed files with 9 additions and 33 deletions

View File

@ -14,8 +14,12 @@
### Field ### Field
- [ ] icon 属性重命名为 right-icon - [x] 移除 onIconClick 属性
- [ ] icon 插槽重命名为 right-icon - [x] icon 属性重命名为 right-icon
- [x] icon 插槽重命名为 right-icon
- [x] click-icon 事件重命名为 click-right-icon
改动原因规范命名onIconClick 属性可以被 click-right-icon 代替
### GoodsAction ### GoodsAction

View File

@ -20,7 +20,6 @@ export default sfc({
labelWidth: [String, Number], labelWidth: [String, Number],
labelAlign: String, labelAlign: String,
inputAlign: String, inputAlign: String,
onIconClick: Function,
autosize: [Boolean, Object], autosize: [Boolean, Object],
errorMessage: String, errorMessage: String,
errorMessageAlign: String, errorMessageAlign: String,
@ -130,10 +129,7 @@ export default sfc({
}, },
onClickRightIcon() { onClickRightIcon() {
// compatible old version
this.$emit('click-icon');
this.$emit('click-right-icon'); this.$emit('click-right-icon');
this.onIconClick && this.onIconClick();
}, },
onClear(event) { onClear(event) {
@ -220,11 +216,11 @@ export default sfc({
renderRightIcon() { renderRightIcon() {
const { slots } = this; const { slots } = this;
const showRightIcon = slots('right-icon') || slots('icon') || this.rightIcon || this.icon; const showRightIcon = slots('right-icon') || this.rightIcon;
if (showRightIcon) { if (showRightIcon) {
return ( return (
<div class={bem('right-icon')} onClick={this.onClickRightIcon}> <div class={bem('right-icon')} onClick={this.onClickRightIcon}>
{slots('right-icon') || slots('icon') || <Icon name={this.rightIcon || this.icon} />} {slots('right-icon') || <Icon name={this.rightIcon} />}
</div> </div>
); );
} }

View File

@ -44,17 +44,6 @@ exports[`render label slot 1`] = `
</div> </div>
`; `;
exports[`render right icon with icon prop for old version 1`] = `
<div class="van-cell van-field">
<div class="van-cell__value van-cell__value--alone">
<div class="van-field__body"><input type="text" class="van-field__control">
<div class="van-field__right-icon"><i class="van-icon van-icon-success">
<!----></i></div>
</div>
</div>
</div>
`;
exports[`render textarea 1`] = ` exports[`render textarea 1`] = `
<div class="van-cell van-field"> <div class="van-cell van-field">
<div class="van-cell__value van-cell__value--alone"> <div class="van-cell__value van-cell__value--alone">

View File

@ -11,22 +11,18 @@ test('input event', () => {
}); });
test('click icon event', () => { test('click icon event', () => {
const onIconClick = jest.fn();
const wrapper = mount(Field, { const wrapper = mount(Field, {
propsData: { propsData: {
value: 'a', value: 'a',
leftIcon: 'contact', leftIcon: 'contact',
rightIcon: 'search', rightIcon: 'search'
onIconClick
} }
}); });
wrapper.find('.van-field__left-icon').trigger('click'); wrapper.find('.van-field__left-icon').trigger('click');
wrapper.find('.van-field__right-icon').trigger('click'); wrapper.find('.van-field__right-icon').trigger('click');
expect(wrapper.emitted('click-icon')).toBeTruthy();
expect(wrapper.emitted('click-left-icon')).toBeTruthy(); expect(wrapper.emitted('click-left-icon')).toBeTruthy();
expect(wrapper.emitted('click-right-icon')).toBeTruthy(); expect(wrapper.emitted('click-right-icon')).toBeTruthy();
expect(onIconClick).toHaveBeenCalled();
}); });
test('keypress event', () => { test('keypress event', () => {
@ -179,15 +175,6 @@ test('render label slot', () => {
expect(wrapper).toMatchSnapshot(); expect(wrapper).toMatchSnapshot();
}); });
test('render right icon with icon prop for old version', () => {
const wrapper = mount(Field, {
propsData: {
icon: 'success'
}
});
expect(wrapper).toMatchSnapshot();
});
test('size prop', () => { test('size prop', () => {
const wrapper = mount(Field, { const wrapper = mount(Field, {
propsData: { propsData: {