支付宝小程序引导组件 背景蒙层·Mask
2020-09-18 11:22 更新
可用于需要遮罩蒙层的弹层元素。
扫码体验
示例代码
{
"defaultTitle": "Mask",
"usingComponents": {
"mask": "mini-ali-ui/es/mask/index"
}
}
<mask type="{{type}}" show="{{show}}" maskZindex="{{maskZindex}}" onMaskTap="maskClick"></mask>
Page({
data: {
type: 'market',
maskZindex: 10,
},
maskClick() {
if (this.data.type === 'market') {
this.setData({
type: 'product',
});
} else {
this.setData({
type: 'market',
show: false,
});
}
},
});
属性
属性 | 类型 | 默认值 | 描述 | 必填 | 最低版本 |
---|---|---|---|---|---|
type | String | product | 显示不同透明度的蒙层。可选值:product:产品弹窗类型蒙层,透明度 0.55;market:市场营销弹窗类型蒙层,透明度 0.75。 | - | - |
maskZindex | Number | - | 自定义蒙层的 z-index 层级。 | - | - |
show | Boolean | - | 是否显示蒙层。 | - | - |
onMaskTap | EventHandle | () => { } | 蒙层点击事件。 | - | - |
fixMaskFull | Boolean | false | 用以解决遮罩层受到 transform 影响而显示不全的问题。 | - | 1.0.11 |
以上内容是否对您有帮助:
更多建议: