perf(input): foucs blur 原生事件绑定
This commit is contained in:
@@ -1,8 +1,7 @@
|
||||
<template>
|
||||
<div class="layui-colla-item">
|
||||
<h2 class="layui-colla-title" @click="showHandle">
|
||||
{{ title
|
||||
}}<i class="layui-icon layui-colla-icon">{{ isShow ? '' : '' }}</i>
|
||||
{{ title }}<i class="layui-icon layui-colla-icon">{{ isShow ? '' : '' }}</i>
|
||||
</h2>
|
||||
<div class="layui-colla-content" :class="isShow ? 'layui-show' : ''">
|
||||
<p>
|
||||
|
||||
@@ -7,7 +7,9 @@
|
||||
:disabled="disabled"
|
||||
class="layui-input"
|
||||
:class="{ 'layui-disabled': disabled }"
|
||||
@input="updateValue"
|
||||
@input="onInput"
|
||||
@focus="onFocus"
|
||||
@blur="onBlur"
|
||||
/>
|
||||
</template>
|
||||
|
||||
@@ -23,11 +25,19 @@ const props =
|
||||
disabled?: boolean
|
||||
}>()
|
||||
|
||||
const emit = defineEmits(['update:modelValue', 'input'])
|
||||
const emit = defineEmits(['update:modelValue', 'input', 'focus', 'blur'])
|
||||
|
||||
const updateValue = function (event: InputEvent) {
|
||||
const onInput = function (event: InputEvent) {
|
||||
const inputElement = event.target as HTMLInputElement
|
||||
emit('update:modelValue', inputElement.value)
|
||||
emit('input', inputElement.value)
|
||||
emit('input', event)
|
||||
}
|
||||
|
||||
const onFocus = function (event: FocusEvent) {
|
||||
emit('focus', event)
|
||||
}
|
||||
|
||||
const onBlur = function () {
|
||||
emit('blur')
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user