组件中的Props
在项目开发中,在开发某些界面时,我们可以将一些代码封装成组件来简化代码。但是,如果某些情况下组件中的某些属性不是一成不变的(比如一个头像+姓名的组件,每次使用时都需要改变其图像src和姓名字符串),我们就可以使用Props。
我们要使用Props,我们需要先在组件中声明注册
例如,一个商品图片+名字的组件,我们每次使用时都要向其中传入一个图像src和一个名字字符串。
组件代码如下:
<template><view><image :src="pic"></image><view>{{goods_name}}</view></view>
</template><script setup>defineProps(['pic','goods_name'])
</script><style lang="scss"></style>
在界面中使用组件:
<view><blog_Props pic="../../static/ai.jpg" goods_name="Picture1"></blog_Props>
</view>
效果如下: