fix: 🐛 修复Input初始化修改失败的问题 (#814)

This commit is contained in:
gouzi 2025-01-04 21:27:17 +08:00 committed by GitHub
parent 9b50d6c692
commit 04e9a50ede
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -57,9 +57,9 @@
<view v-if="showWordCount" class="wd-input__count"> <view v-if="showWordCount" class="wd-input__count">
<text <text
:class="[ :class="[
inputValue && String(inputValue).length > 0 ? 'wd-input__count-current' : '', inputValue && String(inputValue).length > 0 ? 'wd-input__count-current' : '',
String(inputValue).length > maxlength! ? 'is-error' : '' String(inputValue).length > maxlength! ? 'is-error' : ''
]" ]"
> >
{{ String(inputValue).length }} {{ String(inputValue).length }}
</text> </text>
@ -88,7 +88,7 @@ export default {
<script lang="ts" setup> <script lang="ts" setup>
import wdIcon from '../wd-icon/wd-icon.vue' import wdIcon from '../wd-icon/wd-icon.vue'
import { computed, onBeforeMount, ref, watch } from 'vue' import { computed, onBeforeMount, ref, watch } from 'vue'
import { isDef, objToStyle, pause } from '../common/util' import { isDef, objToStyle, pause, isEqual } from '../common/util'
import { useCell } from '../composables/useCell' import { useCell } from '../composables/useCell'
import { FORM_KEY, type FormItemRule } from '../wd-form/types' import { FORM_KEY, type FormItemRule } from '../wd-form/types'
import { useParent } from '../composables/useParent' import { useParent } from '../composables/useParent'
@ -115,7 +115,7 @@ const isPwdVisible = ref<boolean>(false)
const clearing = ref<boolean>(false) // const clearing = ref<boolean>(false) //
const focused = ref<boolean>(false) // const focused = ref<boolean>(false) //
const focusing = ref<boolean>(false) // const focusing = ref<boolean>(false) //
const inputValue = ref<string | number>('') // const inputValue = ref<string | number>(getInitValue()) //
const cell = useCell() const cell = useCell()
watch( watch(
@ -130,8 +130,7 @@ watch(
() => props.modelValue, () => props.modelValue,
(newValue) => { (newValue) => {
inputValue.value = isDef(newValue) ? String(newValue) : '' inputValue.value = isDef(newValue) ? String(newValue) : ''
}, }
{ immediate: true, deep: true }
) )
const { parent: form } = useParent(FORM_KEY) const { parent: form } = useParent(FORM_KEY)
@ -210,14 +209,13 @@ const labelStyle = computed(() => {
: '' : ''
}) })
onBeforeMount(() => {
initState()
})
// //
function initState() { function getInitValue() {
inputValue.value = formatValue(inputValue.value) const formatted = formatValue(props.modelValue)
emit('update:modelValue', inputValue.value) if (!isValueEqual(formatted, props.modelValue)) {
emit('update:modelValue', formatted)
}
return formatted
} }
function formatValue(value: string | number) { function formatValue(value: string | number) {
@ -284,6 +282,9 @@ function onClickPrefixIcon() {
function handleClick(event: MouseEvent) { function handleClick(event: MouseEvent) {
emit('click', event) emit('click', event)
} }
function isValueEqual(value1: number | string, value2: number | string) {
return isEqual(String(value1), String(value2))
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>