Loading... 当我们需要在模块之间传输数据的时候就需要用到props。 `app.vue` ```vue <template> <test :personlist="personList"/> </template> <script lang="ts" setup name="test"> import { reactive } from 'vue'; import test from './components/test.vue' import {type persons } from '@/types'; let personList=reactive<persons>([ {id:'12345',name:'张三',age:18}, {id:'12346',name:'李四',age:19}, {id:'12347',name:'王五',age:20,x:123} ]) </script> <style> </style> ``` `test.vue` ```vue <template> <div class="person"> <ul> <li v-for="temp in list" :key="temp.id">{{ temp.name }}--{{ temp.age }}</li> </ul> </div> </template> <script lang="ts" setup name="test"> import type { persons } from '@/types'; defineProps<{list?:persons}>() </script> <style> </style> ``` defineProps用法: `defineProps<{list?:persons}>()` <>为限制类型,加?代表可以不必须的参数 最后修改:2025 年 02 月 03 日 © 允许规范转载 赞 不用打赏哦!