气泡。
属性名 | 描述 | 类型 | 默认值 | 必选 |
className | 最外层覆盖样式 | String | false | |
show | 气泡是否展示 | Boolean | false | true |
showMask | 蒙层是否展示 | Boolean | true | false |
position | 气泡位置可选值:top 、topRight 、topLeft 、bottom 、bottomLeft 、bottomRight 、right 、rightTop 、rightBottom 、left 、leftBottom 、 leftTop |
String | bottomRight | false |
属性名 | 描述 | 类型 | 默认值 | 必选 |
className | 单项样式 | String | false | |
onItemClick | 单项点击事件 | () => void | false |
1 2 3 4 5 6 | { "usingComponents" : { "popover" : "mini-antui/es/popover/index" , "popover-item" : "mini-antui/es/popover/popover-item/index" } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <popover position= "{{position}}" show= "{{show}}" showMask= "{{showMask}}" onMaskClick= "onMaskClick" > <view onTap= "onShowPopoverTap" >点击显示</view> <view slot= "items" > <popover-item onItemClick= "itemTap1" > <text>line1</text> </popover-item> <popover-item> <text>line2</text> </popover-item> </view> </popover> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | Page({ data: { position: 'bottomRight' , show: false , showMask: true , }, onMaskClick() { this .setData({ show: false , }); }, onShowPopoverTap() { this .setData({ show: true , }); }, itemTap1() { my.alert({ content: '点击1' , }); }, }); |