组件内容:
index.js文件
Component({
/**
* 组件的属性列表
*/
properties: { //组件的对外属性,是属性名到属性设置的映射表,属性设置中可包含三个字段,
condition:{ //type 表示属性类型、 value 表示属性初始值、 observer 表示属性值被更改时的响应函数
type:Boolean,
value:false
}
},
/**
* 组件的初始数据
*/
data: { //组件的内部数据,和 properties 一同用于组件的模版渲染
},
/**
* 组件的方法列表
*/
methods: { //组件的方法,包括事件响应函数和任意的自定义方法,关于事件响应函数的使用
tap(){
this.setData({
condition: false
})
}
}
})
index.json
{
"component": true,
"usingComponents": {}
}
index.wsxx
/* components/myHint/index.wxss */
@import '../../app.wxss';
.modal{
width: 100%;
height: 100%;
z-index:100;
position: fixed;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.5);
color: #fff;
font-size: 38rpx;
}
index.wxml
<view class='modal' wx:if="{{condition}}" bindtap='tap'>
<view class='jt'>
<icon class='iconfont icon-zhishijiantou'></icon>
</view>
<view class='hint-text'>
您还没有验证手机号码
</view>
</view>
父组件引用子组件:
index.json
{
"navigationBarTitleText": "订单详情",
"usingComponents": {
"orderGoods": "../../../components/orderGoods/index",
"statusTime": "../../../components/statusTime/index",
"popupButton": "../../../components/popupButton/index"
},
"enablePullDownRefresh": false
}
index.wxml
<block wx:for="{{form.goods}}" wx:key="index">
<orderGoods jdata="{{item}}" status="{{form.status.types}}"></orderGoods>
</block>