微信小程序：弹窗列表组件封装

微信小程序&＃xff1a;弹窗组件封装

// popup.wxml{{item}}


// popup.json
{"component": true,"usingComponents": {}
}


/* components/popup/popup.wxss */
.jy_popup {opacity: 1;.jy_mask {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.6);z-index: 1000;}.lists {position: fixed;width: 80%;max-width: 600rpx;min-height: 800rpx;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);background-color: #fff;text-align: center;border-radius: 20rpx;overflow: hidden;z-index: 5000;.list {border-bottom: 1rpx solid #ccc;padding-top: 20rpx;padding-bottom: 20rpx;overflow: hidden;position: relative;.clear {position: absolute;right: 14rpx;top: 14rpx;}}}
}

/* components/popup/popup.js */
Component({/*** 组件的属性列表*/properties: {lists: {type: Array,value: []}},/*** 组件的初始数据*/data: {showMask:false},/*** 组件的方法列表*/methods: {show() {this.setData({showMask: true});},hide() {this.setData({showMask: false});},// 关闭弹窗_closeMask() {this.triggerEvent("closeMask");},// 选择项目_selectList(e) {let index &＃61; e.currentTarget.dataset.id;this.triggerEvent("selectList", index);},// 清除_clear(e) {let index &＃61; e.currentTarget.dataset.idx;this.triggerEvent("clear", index);}}
});