vue的属性传值

vue通过属性来传值，其实很简单，主要就是把传入的对象的key和value分清楚就可以了，比如被传对象  :list = listUl,在这个属性中，list是要传出的，而listUl就是你定义的数据，同时在接收的时候也是同样，使用props来就收即可，在html中写入即可完成通过属性的方式来传值

eg:

app.vue（传出数据页面）

<template>

　　<Counters :list=listUl>

　　</Counters>

</template>

<script>

　　import {ref} from "vue";

　　import Counters from  'counters.vue的对应的路径'

　　export default{

　　compontents:{

　　　　Counters

　　},setup{

　　　　const listUl = ref(1000);

　　　　return {listUl}

　　}

　　}

</script>

 

counters.vue(接收数据页面)

<template>

　　<h1>{{list}}</h1>

</template>

<script>

　　export default{

　　　　props:["list"]

　　}

<script>

---

注意事项：

　　1.在页面中不要把对应的key和vue传入错误

　　2.在声明数据使用setup的时候，不要忘记return 返回值，当忘记return返回值得时候，数据是不会显示的