Вопрос в форме реагирования: почему getValues ​​не возвращает самое текущее значение?

У меня есть переключатели: A, B и C.

Под кнопкой B есть поле выбора, и я хочу, чтобы это поле выбора было «обязательным» только тогда, когда выбрано B.

Вот упрощенный код:

interface ButtonFormType {
    notificationType: "A" | "B" | "C";
    selectedId?: string;
}
const {
        register,
        handleSubmit,
        getValues,
        watch,
        formState: { errors },
    } = useForm<ButtonFormType>();

.
.
.

return(
 <form onSubmit = {submit}>
  <RadioGroup defaultValue = {getValues("buttonType")}>
    <VStack>
      <Radio {...register("buttonType")} value = {"A"}> Button A </Radio>
      <Radio {...register("buttonType")} value = {"B"}> Button B </Radio>
      <FormControl isInvalid = {!!errors[`selectedId`]}>
         <Select
            placeholder = {"select"}
            {...register("selectedId", {
                required:
                   getValues("buttonType") === "B"
                   ? "please select id"
                   : false,
            })}
         >
            {idList.map(({ id, title }) => {
               return (
                  <option key = {id} value = {id}>
                       {title}
                  </option>
                                        );
            })}
         </Select>
      </FormControl>
     <Radio {...register("buttonType")} value = {"C"}> Button C </Radio>
    </VStack>
   </RadioGroup>
                  
   <HStack marginY = "40px" spacing = {4}>
      <Button type = "submit"> Submit </Button>
   </HStack>
</form>
)

когда я нажимаю кнопку B (не выбирая ничего из поля выбора) и нажимаю кнопку отправки, это не дает мне никакой ошибки.

Если я снова нажму кнопку отправки, появится сообщение об ошибке.

Я проверил и обнаружил, что getValues("buttonType") не обновляется, как только я меняю buttonType.

Он обновляется, как только я нажимаю кнопку «Отправить». почему?

Я мог бы решить эту проблему, изменив getValues на watch вот так

required:
                   watch("buttonType") === "B"
                   ? "please select id"
                   : false,

но до сих пор не могу понять, почему getValues ​​не работает. Кто-нибудь знает?

🤔 А знаете ли вы, что...
React Hooks - это механизм, введенный в React 16.8, для управления состоянием компонентов функциональным способом.