mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-05-26 08:19:15 +08:00
[breaking change] Field: renaming icon props、events
This commit is contained in:
parent
1c5c5eaf73
commit
706f047909
@ -14,8 +14,12 @@
|
||||
|
||||
### Field
|
||||
|
||||
- [ ] icon 属性重命名为 right-icon
|
||||
- [ ] icon 插槽重命名为 right-icon
|
||||
- [x] 移除 onIconClick 属性
|
||||
- [x] icon 属性重命名为 right-icon
|
||||
- [x] icon 插槽重命名为 right-icon
|
||||
- [x] click-icon 事件重命名为 click-right-icon
|
||||
|
||||
改动原因:规范命名,onIconClick 属性可以被 click-right-icon 代替
|
||||
|
||||
### GoodsAction
|
||||
|
||||
|
@ -20,7 +20,6 @@ export default sfc({
|
||||
labelWidth: [String, Number],
|
||||
labelAlign: String,
|
||||
inputAlign: String,
|
||||
onIconClick: Function,
|
||||
autosize: [Boolean, Object],
|
||||
errorMessage: String,
|
||||
errorMessageAlign: String,
|
||||
@ -130,10 +129,7 @@ export default sfc({
|
||||
},
|
||||
|
||||
onClickRightIcon() {
|
||||
// compatible old version
|
||||
this.$emit('click-icon');
|
||||
this.$emit('click-right-icon');
|
||||
this.onIconClick && this.onIconClick();
|
||||
},
|
||||
|
||||
onClear(event) {
|
||||
@ -220,11 +216,11 @@ export default sfc({
|
||||
|
||||
renderRightIcon() {
|
||||
const { slots } = this;
|
||||
const showRightIcon = slots('right-icon') || slots('icon') || this.rightIcon || this.icon;
|
||||
const showRightIcon = slots('right-icon') || this.rightIcon;
|
||||
if (showRightIcon) {
|
||||
return (
|
||||
<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>
|
||||
);
|
||||
}
|
||||
|
@ -44,17 +44,6 @@ exports[`render label slot 1`] = `
|
||||
</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`] = `
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__value van-cell__value--alone">
|
||||
|
@ -11,22 +11,18 @@ test('input event', () => {
|
||||
});
|
||||
|
||||
test('click icon event', () => {
|
||||
const onIconClick = jest.fn();
|
||||
const wrapper = mount(Field, {
|
||||
propsData: {
|
||||
value: 'a',
|
||||
leftIcon: 'contact',
|
||||
rightIcon: 'search',
|
||||
onIconClick
|
||||
rightIcon: 'search'
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.find('.van-field__left-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-right-icon')).toBeTruthy();
|
||||
expect(onIconClick).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
test('keypress event', () => {
|
||||
@ -179,15 +175,6 @@ test('render label slot', () => {
|
||||
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', () => {
|
||||
const wrapper = mount(Field, {
|
||||
propsData: {
|
||||
|
Loading…
x
Reference in New Issue
Block a user