Vue3 props 语法糖

父传子

父组件

<template>
  <Person :age="age" />
</template>

<script lang="ts" setup name="App">
import { ref } from 'vue';
import Person from './components/Person.vue';
let age = ref(100)

</script>

<style>

</style>

子组件

<template>
    年龄:{{ age }}
    <button @click="changeAge">比较</button>
</template>

<script lang="ts" setup name="Person">
// 接受
let a = defineProps(["age"])
// 使用props传的值
function changeAge(){
    console.log(a.age);
    
}
</script>

<style>

</style>

 

posted @ 2025-03-15 15:50  市丸银  阅读(11)  评论(0)    收藏  举报