如果我们正在构建一个博客,我们可能需要一个表示博客文章的组件。我们希望所有的博客文章分享相同的视觉布局,但有不同的内容。要实现这样的效果自然必须向组件中传递数据,例如每篇文章标题和内容,这就会使用到 props。
Props 是一种特别的 attributes,你可以在组件上声明注册。要传递给博客文章组件一个标题,我们必须在组件的 props 列表上声明它。这里要用到defineProps宏
defineProps数据传递
但是这个值不能在组件的script中直接修改,需要把defineProps给一个变量然后再用用数组的方式修改
defineProps中使用对象
使用对象来约束传过来的值不会是用对象设立以外的值
还可以用对象给defineProps的对象来设置默认值
主页面信息
组件页面信息
defineProps循环遍历数组
也可以把他们放入数组中用循环来遍历
1.在组件页面defineprops中的对象用对象赋值
2.在主页面中用v-for循环数组,把item放入对象中