萧山城区建设有限公司网站,蓝天云免费空间主机,免费自创网站,8u免费空间Vue3中使用v-model高级用法参数绑定传值 单个输入框传值多个输入框传值,一个组件接受多个v-model值 单个输入框传值
App.vue
templatep{{firstName}}/phello-world v-modelfirstName/hello-world
/template… Vue3中使用v-model高级用法参数绑定传值 单个输入框传值多个输入框传值,一个组件接受多个v-model值 单个输入框传值
App.vue
templatep{{firstName}}/phello-world v-modelfirstName/hello-world
/templatescript setup
import {ref} from vue;
import HelloWorld from ./components/HelloWorld.vue;const firstName ref(firstName);/scriptHelloWorld.vue
templateinput typetext:valuemodelValueinput$emit(update:modelValue,$event.target.value)
/templatescript setup
defineProps([modelValue]);
defineEmits([update:modelValue]);
/script多个输入框传值,一个组件接受多个v-model值
App.vue
templatep{{firstName}}/pp{{lastName}}/phello-world v-model:firstNamefirstName v-model:lastNamelastName/hello-world
/templatescript setup
import {ref} from vue;
import HelloWorld from ./components/HelloWorld.vue;const firstName ref(firstName);
const lastName ref(lastName);/scriptHelloWorld.vue
templateinput typetext:valuefirstNameinput$emit(update:firstName,$event.target.value)/br/input typetext:valuelastNameinput$emit(update:lastName,$event.target.value)/
/templatescript setup
defineProps([firstName,lastName]);
defineEmits([update:firstName,update:lastName]);
/script