[new feature] Field: add click event

docs/markdown/changelog.zh-CN.md

@@ -4,6 +4,7 @@
 
 ##### Field
 
+- 新增`click`事件
 - 新增`clickable`属性
 
 ##### Stepper

packages/field/demo/index.vue

@@ -15,9 +15,9 @@
           v-model="username"
           :label="$t('username')"
           :placeholder="$t('usernamePlaceholder')"
+          required
           clearable
           right-icon="question-o"
-          required
           @click-right-icon="$toast('question')"
         />
 

packages/field/en-US.md

@@ -152,6 +152,7 @@ Field support all native events of input tag，such as `focus`、`blur`、`keypr
 | Event | Description | Parameters |
 |------|------|------|
 | input | Triggered when value changed | - |
+| click | Triggered when click field | - |
 | clear | Triggered when click clear icon | - |
 | click-left-icon | Triggered when click the left icon of Field | - |
 | click-right-icon | Triggered when click the right icon of Field | - |

packages/field/index.js

@@ -59,13 +59,17 @@ export default sfc({
     },
 
     listeners() {
-      return {
+      const listeners = {
         ...this.$listeners,
         input: this.onInput,
         keypress: this.onKeypress,
         focus: this.onFocus,
         blur: this.onBlur
       };
+
+      delete listeners.click;
+
+      return listeners;
     },
 
     labelStyle() {
@@ -130,6 +134,10 @@ export default sfc({
       }
     },
 
+    onClick(event) {
+      this.$emit('click', event);
+    },
+
     onClickLeftIcon() {
       this.$emit('click-left-icon');
     },
@@ -272,6 +280,7 @@ export default sfc({
           'min-height': this.type === 'textarea' && !this.autosize
         })}
         scopedSlots={scopedSlots}
+        onClick={this.onClick}
       >
         <div class={bem('body')}>
           {this.renderInput()}

packages/field/test/index.spec.js

@@ -10,6 +10,13 @@ test('input event', () => {
   expect(wrapper.emitted('input')[0][0]).toEqual('1');
 });
 
+test('click event', () => {
+  const wrapper = mount(Field);
+
+  wrapper.trigger('click');
+  expect(wrapper.emitted('click')[0][0]).toBeTruthy();
+});
+
 test('click icon event', () => {
   const wrapper = mount(Field, {
     propsData: {

packages/field/zh-CN.md

@@ -155,6 +155,7 @@ Field 默认支持 Input 标签所有的原生事件，如 `focus`、`blur`、`k
 | 事件 | 说明 | 回调参数 |
 |------|------|------|
 | input | 输入框内容变化时触发 | - |
+| click | 点击时触发 | - |
 | clear | 点击清除按钮后触发 | - |
 | click-left-icon | 点击头部图标时触发 | - |
 | click-right-icon | 点击尾部图标时触发 | - |