Basically I got an input form, I want to show error if min length is not met.

I have a multiselect component that has input inside it, and on option select the input max length should change. I got this function that changes the refs value.

<Multiselect @select="makeMaxLength()" />

  function makeMaxLength() {
      const maxLength = passwordType().length
      maxPasswordLength.value = maxLength
      console.log(maxPasswordLength.value) // works fine and always shows new value
    }

even when the ref changes I keep getting this error passwordAnswer must be at most 0 characters

   const schema = yup.object().shape({
    passwordAnswer: yup.string().max(maxPasswordLength.value),
    });

I've tried this as well but here I get passwordAnswer must be at most [Function anonymous] characters

 const schema = yup.object().shape({
    passwordAnswer: yup.string().max(() => maxPasswordLength.value),
    });