fix(FormGroup): hydration mismatch on inputId (#942)

This commit is contained in:
Romain Hamel
2023-11-14 14:23:51 +01:00
committed by GitHub
parent 3c71bf36b0
commit a3046aa256
4 changed files with 18 additions and 12 deletions

View File

@@ -1,6 +1,7 @@
import { inject, ref, computed, onMounted } from 'vue'
import { type UseEventBusReturn, useDebounceFn } from '@vueuse/core'
import type { FormEvent, FormEventType, InjectedFormGroupValue } from '../types/form'
import { uid } from '../utils/uid'
type InputProps = {
id?: string | null
@@ -18,7 +19,8 @@ export const useFormGroup = (inputProps?: InputProps, config?: any) => {
const inputId = ref(inputProps?.id)
onMounted(() => {
inputId.value = inputProps?.isFieldset ? null : inputProps?.id ?? formGroup?.inputId.value
inputId.value = inputProps?.isFieldset ? null : inputProps?.id ?? uid()
if (formGroup) {
// Updates for="..." attribute on label if inputProps.id is provided
formGroup.inputId.value = inputId.value