mirror of
https://github.com/go-vikunja/vikunja.git
synced 2026-02-01 22:47:40 +00:00
fix(frontend): make FormField value binding conditional
When FormField is used without v-model (modelValue undefined), the component was clearing user input on re-render. This broke login forms that access the input value directly via refs for browser autofill compatibility. Now the value attribute is only bound when modelValue is explicitly provided, allowing native input behavior when v-model isn't used.
This commit is contained in:
@@ -33,6 +33,16 @@ const controlClasses = computed(() => [
|
||||
{'is-expanded': hasAddon.value},
|
||||
])
|
||||
|
||||
// Only bind value when modelValue is explicitly provided (not undefined)
|
||||
// This allows the component to be used without v-model for native input behavior
|
||||
const inputBindings = computed(() => {
|
||||
const bindings: Record<string, unknown> = {}
|
||||
if (props.modelValue !== undefined) {
|
||||
bindings.value = props.modelValue
|
||||
}
|
||||
return bindings
|
||||
})
|
||||
|
||||
// Expose input element for direct access (needed for browser autofill workarounds)
|
||||
const inputRef = ref<HTMLInputElement | null>(null)
|
||||
defineExpose({
|
||||
@@ -57,8 +67,7 @@ defineExpose({
|
||||
<input
|
||||
:id="inputId"
|
||||
ref="inputRef"
|
||||
v-bind="$attrs"
|
||||
:value="modelValue"
|
||||
v-bind="{ ...$attrs, ...inputBindings }"
|
||||
class="input"
|
||||
@input="$emit('update:modelValue', ($event.target as HTMLInputElement).value)"
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user