Popup 弹出
代码展示
<alice-popup v-model="popup1">
<div class="p20">中间弹出</div>
</alice-popup>
<alice-popup v-model="popup2" transiton="left">
<div class="p20">左边弹出</div>
</alice-popup>
<alice-popup v-model="popup3" transiton="right">
<div class="p20">右边弹出</div>
</alice-popup>
<alice-popup v-model="popup4" transiton="top">
<div class="p20">上边弹出</div>
</alice-popup>
<alice-popup v-model="popup5" transiton="bottom">
<div class="p20">下边弹出</div>
</alice-popup>
Popup API
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
value | 当前组件是否显示 | Boolean | false |
isMask | 是否显示遮罩 | Boolean | true |
closeOnClickMask | 是否点击遮罩关闭 | Boolean | true |
position | 位置,可选值为 top bottom right left fade | String | fade |
transition | 动画移动,可选值为 top bottom right left fade | String | fade |
Popup Event
事件名 | 说明 | 参数 |
---|---|---|
input | 当绑定值变化时触发的事件 | 当前组件的值 |
on-change | 当绑定值变化时触发的事件 | 当前组件的值 |
Popup Slot
名称 | 说明 |
---|---|
- | 插入 |