(component): update

This commit is contained in:
就眠儀式 2022-11-08 00:44:59 +08:00
parent a3f3f8c710
commit e04adb3263
2 changed files with 18 additions and 13 deletions

View File

@ -77,20 +77,11 @@ watch(
} }
); );
watch(
() => currentValue,
() => {
emit("update:modelValue", currentValue.value);
}
);
const onInput = function (event: Event) { const onInput = function (event: Event) {
const inputElement = event.target as HTMLInputElement; const inputElement = event.target as HTMLInputElement;
const value = inputElement.value; let value= inputElement.value;
emit("input", value); emit("input", value);
if (composing.value) { if (composing.value) return;
return;
}
emit("update:modelValue", value); emit("update:modelValue", value);
}; };
@ -110,6 +101,20 @@ const onChange = (event: Event) => {
}; };
const onBlur = (event: Event) => { const onBlur = (event: Event) => {
let value = (event.target as HTMLInputElement).value;
if(props.type === "number") {
if(value === "" && !props.min) {
value = "0";
} else {
if(props.max && props.max < Number(value)) {
value = props.max.toString();
}
if(props.min && props.min > Number(value)) {
value = props.min.toString();
}
}
emit("update:modelValue", value);
}
emit("blur", event); emit("blur", event);
}; };
@ -156,7 +161,6 @@ const showPassword = () => {
:type="type" :type="type"
:name="name" :name="name"
:disabled="disabled" :disabled="disabled"
:value="currentValue"
:placeholder="placeholder" :placeholder="placeholder"
:autofocus="autofocus" :autofocus="autofocus"
:autocomplete="autocomplete" :autocomplete="autocomplete"
@ -164,6 +168,7 @@ const showPassword = () => {
:max="max" :max="max"
:min="min" :min="min"
:readonly="readonly" :readonly="readonly"
:value="currentValue"
@input="onInput" @input="onInput"
@change="onChange" @change="onChange"
@focus="onFocus" @focus="onFocus"

View File

@ -13,7 +13,7 @@
::: demo 使用 `lay-input` 标签, 创建输入框。 ::: demo 使用 `lay-input` 标签, 创建输入框。
<template> <template>
<lay-input v-model="data1"></lay-input> <lay-input v-model="data1" type="number" :max="300" :min="100"></lay-input>
</template> </template>
<script> <script>