原理:通知在组件标签中传递参数已达到传参的目的
在组件的js的 properties中接受传递来的参数
然后在页面是展示这些数据
源码:
<!--components/my-info/my-info.wxml-->
<view class="title">
<text class="texts">{{title}}</text>
</view>
<view class="conut">
<text class="number">{{conut}}</text>
</view>
// components/my-info/my-info.js
Component({
/**
* 组件的属性列表
*/
properties: {
title:{
type:String,
value:"标题"
},
conut:{
type:String,
value:"内容没有写哦"
}
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 组件的方法列表
*/
methods: {
}
})
/* components/my-info/my-info.wxss */
.texts{
color: blue;
font-size: large;
}
.number{
color:chartreuse;
font-size: larger;
}
{
"component": true,
"usingComponents": {}
}
并在需要引入组件传参的地方使用组件即可文章来源:https://www.toymoban.com/news/detail-813697.html
<my-info title="牛马程序员1" conut="我是牛马程序员"></my-info>
<my-info title="牛马程序员2" conut="我是牛马程序员2"></my-info>
<my-info title="牛马程序员3" conut="我是牛马程序员3"></my-info>
文章来源地址https://www.toymoban.com/news/detail-813697.html
到了这里,关于小程序基础学习(组件传参)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!