vue3 父子传值 props
Father.vuetemplate div classfather h3父组件/h3 h4汽车{{ car }}/h4 h4 v-showtoyChild给的玩具{{toy}}/h4 Child :carcar :sendToygetToy/Child /div /template script langts nameFather setup import { ref } from vue import Child from ./Child.vue // 数据 let car ref(五菱宏光); let toy ref(); // 方法 value 为子组件传过来的数据 function getToy(value: string){ toy.value value; } /script style scoped .father { background-color: rgb(165, 164, 164); padding: 20px; border-radius: 10px; } /styleChild.vuetemplate div classchild h3子组件/h3 h4玩具{{toy}}/h4 h4父给的车{{car}}/h4 button clicksendToy(toy)玩具给father/button /div /template script langts nameChild setup import { ref } from vue // 数据 let toy ref(奥特曼); // 第一种方法 start // 声明接收 props // let props defineProps([car,sendToy]); // function fasong(){ // // 可以这么调用 // props.sendToy(toy.value); // } // end // 第二种方法 defineProps([car,sendToy]); /script style scoped .child{ background-color: skyblue; padding: 10px; box-shadow: 0 0 10px black; border-radius: 10px; } /style
