diff --git a/api-generator/components/checkbox.js b/api-generator/components/checkbox.js index d0ee781c1..9e1c3d3f4 100644 --- a/api-generator/components/checkbox.js +++ b/api-generator/components/checkbox.js @@ -45,26 +45,24 @@ const CheckboxProps = [ const CheckboxEvents = [ { - "name": "click", - "description": "Callback to invoke on value click.", - arguments: [ - { - name: "event", - type: "object", - description: "Browser event" - } - ] + name: "click", + description: "Callback to invoke on value click.", }, { - "name": "change", - "description": "Callback to invoke on value change.", - arguments: [ - { - name: "event", - type: "object", - description: "Browser event" - } - ] + name: "change", + description: "Callback to invoke on value change.", + }, + { + name: "input", + description: "Callback to invoke on value change." + }, + { + name: "focus", + description: "Callback to invoke when element receives focus." + }, + { + name: "blur", + description: "Callback to invoke when element loses focus." } ]; diff --git a/src/components/checkbox/Checkbox.d.ts b/src/components/checkbox/Checkbox.d.ts index c4a974de6..5bba8c09c 100755 --- a/src/components/checkbox/Checkbox.d.ts +++ b/src/components/checkbox/Checkbox.d.ts @@ -13,6 +13,9 @@ declare class Checkbox { $emit(eventName: 'update:page', value: any): this; $emit(eventName: 'click', event: Event): this; $emit(eventName: 'change', event: Event): this; + $emit(eventName: 'input', value: boolean): this; + $emit(eventName: 'focus', event: Event): this; + $emit(eventName: 'blur', event: Event): this; } export default Checkbox; diff --git a/src/components/checkbox/Checkbox.vue b/src/components/checkbox/Checkbox.vue index 7d9098874..a5ee1d75a 100755 --- a/src/components/checkbox/Checkbox.vue +++ b/src/components/checkbox/Checkbox.vue @@ -54,14 +54,17 @@ export default { this.$emit('click', event); this.$emit('update:modelValue', newModelValue); this.$emit('change', event); + this.$emit('input', newModelValue); this.$refs.input.focus(); } }, onFocus() { this.focused = true; + this.$emit('focus', event); }, onBlur() { this.focused = false; + this.$emit('blur', event); } }, computed: { diff --git a/src/views/checkbox/CheckboxDoc.vue b/src/views/checkbox/CheckboxDoc.vue index d7d11f6c7..0d4cc5793 100755 --- a/src/views/checkbox/CheckboxDoc.vue +++ b/src/views/checkbox/CheckboxDoc.vue @@ -97,7 +97,6 @@ export default {
Events
-

Any valid event such as focus and blur.

@@ -118,6 +117,21 @@ export default { + + + + + + + + + + + + + + +
event: Browser event Callback to invoke on value change.
focusevent: Browser eventCallback to invoke when element receives focus.
blurevent: Browser eventCallback to invoke when element loses focus.
inputvalue: New valueCallback to invoke on value change.