[Vuejs]-Vue 3 can't set value when using axios request in vee-validate

by

0👍

✅

I think this issue because of your axios request. Before the axios request fulfilled, CustomInput component rendered with default props and the useForm composition API initialized with empty value.

My solution:
You can watch value props in CustomInput component setup method. Then every time it’s value changed, update the value:

watch(
    () => props.value,
    (newValue, oldValue) => {
       console.log("value props changed: ", newValue);
       inputValue.value = newValue;
    }
);

In addition you have an issue in CustomInput props. Try to send userInfo.name instead of this.userInfo.name in template section!

You can see my code in this codesandbox project.

Leave a comment