From 55fc38ac493e19d3ccf9324821ed224e5f4a348d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=B1=E7=9C=A0=E4=BB=AA=E5=BC=8F?= <854085467@qq.com>
Date: Wed, 27 Oct 2021 14:02:54 +0800
Subject: [PATCH] =?UTF-8?q?perf(input):=20foucs=20blur=20=E5=8E=9F?=
 =?UTF-8?q?=E7=94=9F=E4=BA=8B=E4=BB=B6=E7=BB=91=E5=AE=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/docs/zh-CN/components/breadcrumb.md |  3 +++
 docs/docs/zh-CN/components/input.md      |  4 +++-
 docs/docs/zh-CN/guide/changelog.md       |  3 ++-
 docs/docs/zh-CN/guide/introduce.md       |  2 +-
 src/module/collapseItem/index.vue        |  3 +--
 src/module/input/index.vue               | 18 ++++++++++++++----
 6 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/docs/docs/zh-CN/components/breadcrumb.md b/docs/docs/zh-CN/components/breadcrumb.md
index 3d5f7f09..d2c8f9f6 100644
--- a/docs/docs/zh-CN/components/breadcrumb.md
+++ b/docs/docs/zh-CN/components/breadcrumb.md
@@ -52,6 +52,9 @@ export default {
 
 :::
 
+::: title 使用插槽
+:::
+
 ::: demo
 
 <template>
diff --git a/docs/docs/zh-CN/components/input.md b/docs/docs/zh-CN/components/input.md
index bcaaaed4..60426584 100644
--- a/docs/docs/zh-CN/components/input.md
+++ b/docs/docs/zh-CN/components/input.md
@@ -112,4 +112,6 @@ export default {
 | placeholder | 提示信息        | --              |
 | disabled    | 禁用            | `true` `false`  |
 | v-model     | 值              | --              |
-| input       | 原生 input 事件 | val : 当前值    |
+| input       | 原生 input 事件 | event : 事件对象  |
+| foucs       | 原生 foucs 事件 | event : 事件对象  |
+| blur        | 原生 blur 事件  | --  |
diff --git a/docs/docs/zh-CN/guide/changelog.md b/docs/docs/zh-CN/guide/changelog.md
index 014720f8..71bf4394 100644
--- a/docs/docs/zh-CN/guide/changelog.md
+++ b/docs/docs/zh-CN/guide/changelog.md
@@ -17,7 +17,8 @@
 [新增] rate 评分 theme 属性, 支持自定义主题。<br>
 [新增] progress 文档, 区分 theme 与 size 使用案例。<br>
 [新增] dropdown 下拉组件 dropdown-item 点击监听, 隐藏 content 内容。<br>
-[修复] rate 评分 modelValue 属性, 双绑逻辑。<br>
+[新增] input 输入框 foucs blur 原生事件绑定。<br>
+[修复] rate 评分 modelValue 属性, 支持双向数据绑定。<br>
 </lay-timeline-item>
 <lay-timeline-item title="0.2.0">
 [新增] carousel 轮播 anim 属性, 支持 default updown 不同方向轮播。<br>
diff --git a/docs/docs/zh-CN/guide/introduce.md b/docs/docs/zh-CN/guide/introduce.md
index 8e57741e..9b62509f 100644
--- a/docs/docs/zh-CN/guide/introduce.md
+++ b/docs/docs/zh-CN/guide/introduce.md
@@ -16,4 +16,4 @@ layui - vue（谐音：类 UI) 是 一 套 Vue 3.0 的 桌 面 端 组 件 库 ,
   <lay-timeline-item title="2017年，layui 里程碑版本 2.0 发布" simple></lay-timeline-item>
   <lay-timeline-item title="2016年，layui 首个版本发布" simple></lay-timeline-item>
   <lay-timeline-item title="2015年，layui 孵化" simple></lay-timeline-item>
-</lay-timeline>
+</lay-timeline>
\ No newline at end of file
diff --git a/src/module/collapseItem/index.vue b/src/module/collapseItem/index.vue
index 0aa80663..eececaca 100644
--- a/src/module/collapseItem/index.vue
+++ b/src/module/collapseItem/index.vue
@@ -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>
diff --git a/src/module/input/index.vue b/src/module/input/index.vue
index 6d87e442..bbb930a3 100644
--- a/src/module/input/index.vue
+++ b/src/module/input/index.vue
@@ -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>