解决 cl-input 事件丢失问题

This commit is contained in:
icssoa
2025-08-20 17:05:17 +08:00
parent a3895a0897
commit 1be694b124
6 changed files with 36 additions and 28 deletions

View File

@@ -78,7 +78,7 @@ import { t } from "@/locale";
const num = ref(0);
const isStep = ref(false);
const isMin = ref(false);
const isMin = ref(true);
const isMax = ref(false);
const isDigit = ref(false);
const isInput = ref(true);

View File

@@ -2,11 +2,11 @@
<cl-page>
<view class="p-3">
<demo-item :label="t('基础用法')">
<cl-input-otp></cl-input-otp>
<cl-input-otp @done="toDone"></cl-input-otp>
</demo-item>
<demo-item :label="t('自动聚焦')">
<cl-input-otp autofocus></cl-input-otp>
<cl-input-otp autofocus @done="toDone"></cl-input-otp>
</demo-item>
<demo-item :label="t('自定义')">

View File

@@ -52,7 +52,7 @@
className: `text-center ${pt.value?.input?.className}`
}
}"
@change="onInput"
@blur="onBlur"
></cl-input>
</view>
@@ -269,14 +269,14 @@ function onMinus() {
}
/**
* 输入框输入处理函数
* 输入框失去焦点处理函数
* @param val 输入的字符串值
*/
function onInput(val: string) {
if (val == "") {
function onBlur(e: UniInputBlurEvent) {
if (e.detail.value == "") {
value.value = 0;
} else {
value.value = parseFloat(val);
value.value = parseFloat(e.detail.value);
}
update();

View File

@@ -21,7 +21,7 @@
:maxlength="length"
:hold-keyboard="false"
:clearable="false"
@input="onInput"
@change="onChange"
@focus="animateCursor(true)"
@blur="animateCursor(true)"
></cl-input>
@@ -174,7 +174,7 @@ watch(
* 输入事件处理
* @param val 输入值
*/
function onInput(val: string) {
function onChange(val: string) {
// 更新绑定值
emit("update:modelValue", val);

View File

@@ -262,14 +262,14 @@ function showPassword() {
}
// 获取焦点事件
function onFocus() {
function onFocus(e: UniInputFocusEvent) {
isFocus.value = true;
emit("focus");
emit("focus", e);
}
// 失去焦点事件
function onBlur() {
emit("blur");
function onBlur(e: UniInputBlurEvent) {
emit("blur", e);
setTimeout(() => {
isFocus.value = false;
@@ -278,14 +278,16 @@ function onBlur() {
// 输入事件
function onInput(e: UniInputEvent) {
const val = e.detail.value;
value.value = val;
const v1 = e.detail.value;
const v2 = value.value;
emit("update:modelValue", val);
emit("input", val);
value.value = v1;
if (val != value.value) {
emit("change", val);
emit("update:modelValue", v1);
emit("input", e);
if (v1 != v2) {
emit("change", v1);
}
}

View File

@@ -268,14 +268,14 @@ const value = ref(props.modelValue);
const isFocus = ref<boolean>(props.autofocus);
// 获取焦点事件
function onFocus() {
function onFocus(e: UniTextareaFocusEvent) {
isFocus.value = true;
emit("focus");
emit("focus", e);
}
// 失去焦点事件
function onBlur() {
emit("blur");
function onBlur(e: UniTextareaBlurEvent) {
emit("blur", e);
setTimeout(() => {
isFocus.value = false;
@@ -284,11 +284,17 @@ function onBlur() {
// 输入事件
function onInput(e: UniInputEvent) {
const val = e.detail.value;
value.value = val;
const v1 = e.detail.value;
const v2 = value.value;
emit("update:modelValue", val);
emit("change", val);
value.value = v1;
emit("update:modelValue", v1);
emit("input", e);
if (v1 != v2) {
emit("change", v1);
}
}
// 点击确认按钮事件