perf(input): foucs blur 原生事件绑定

This commit is contained in:
就眠仪式 2021-10-27 14:17:33 +08:00
parent 55fc38ac49
commit 5aa3544914
4 changed files with 24 additions and 25 deletions

View File

@ -106,12 +106,12 @@ export default {
::: title input 属性 ::: title input 属性
::: :::
| Name | Description | Accepted Values | | Name | Description | Accepted Values |
| ----------- | --------------- | --------------- | | ----------- | --------------- | ---------------- |
| name | 原始属性 name | -- | | name | 原始属性 name | -- |
| placeholder | 提示信息 | -- | | placeholder | 提示信息 | -- |
| disabled | 禁用 | `true` `false` | | disabled | 禁用 | `true` `false` |
| v-model | 值 | -- | | v-model | 值 | -- |
| input | 原生 input 事件 | event : 事件对象 | | input | 原生 input 事件 | event : 事件对象 |
| foucs | 原生 foucs 事件 | event : 事件对象 | | foucs | 原生 foucs 事件 | event : 事件对象 |
| blur | 原生 blur 事件 | -- | | blur | 原生 blur 事件 | -- |

View File

@ -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="2017年layui 里程碑版本 2.0 发布" simple></lay-timeline-item>
<lay-timeline-item title="2016年layui 首个版本发布" 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-item title="2015年layui 孵化" simple></lay-timeline-item>
</lay-timeline> </lay-timeline>

View File

@ -1,7 +1,8 @@
<template> <template>
<div class="layui-colla-item"> <div class="layui-colla-item">
<h2 class="layui-colla-title" @click="showHandle"> <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> </h2>
<div class="layui-colla-content" :class="isShow ? 'layui-show' : ''"> <div class="layui-colla-content" :class="isShow ? 'layui-show' : ''">
<p> <p>
@ -14,13 +15,12 @@
<script setup name="LayCollapseItem" lang="ts"> <script setup name="LayCollapseItem" lang="ts">
import { defineProps, inject, ref } from 'vue' import { defineProps, inject, ref } from 'vue'
const props = const props = defineProps<{
defineProps<{ id: string
id: string title: string
title: string }>()
}>()
const openKeys = inject('openKeys') as String[] const openKeys = inject('openKeys') as string[]
const isShow = ref(openKeys.includes(props.id)) const isShow = ref(openKeys.includes(props.id))

View File

@ -16,14 +16,13 @@
<script setup name="LayInput" lang="ts"> <script setup name="LayInput" lang="ts">
import { defineProps, defineEmits } from 'vue' import { defineProps, defineEmits } from 'vue'
const props = const props = defineProps<{
defineProps<{ name?: string
name?: string type?: string
type?: string modelValue?: string
modelValue?: string placeholder?: string
placeholder?: string disabled?: boolean
disabled?: boolean }>()
}>()
const emit = defineEmits(['update:modelValue', 'input', 'focus', 'blur']) const emit = defineEmits(['update:modelValue', 'input', 'focus', 'blur'])