How is it managed reactivity in form fields (v-model) with Vue3 Composition API? I mean, currently something simple like this doesn't work in my code > vue devtools doesn't show any changes in ref data when I rite some text in my input field:
JS
import { ref, watch, reactive } from 'vue';
const vueapp = Vue.createApp({
setup(props, {attrs, slots, emit}){
const test = ref('');
return {
test
}
},
});
vueapp.mount('#form-panels');
HTML
<input name="test" v-model="test" id="name" type="text" value="" />
Try this code once it should work
import { ref, watch, reactive, toRefs } from 'vue';
const vueapp = Vue.createApp({
setup(props, {attrs, slots, emit}){
const state = {test:''};
return {
...toRefs(state)
}
},
});
vueapp.mount('#form-panels');