更新记录
1.0.2(2020-07-14)
更新插件包内容; 修改插件使用文档;
1.0.1(2020-06-29)
1、aui-poster插件“分离”优化; 2、内容部分点击回调; 3、遮罩层滚动穿层禁止
1.0.0(2020-06-22)
aui-poster广告弹窗首次发布
查看更多平台兼容性
aui-poster广告弹窗
使用时请参考完整示例
支持内容点击回调及关闭弹窗,具体样式使用时可自行修改
参数 | 类型 | 描述 | 默认值 | 必选 |
---|---|---|---|---|
mask | boolean | 是否显示遮罩蒙版 | true | 否 |
maskTapClose | boolean | 触摸遮罩是否关闭模态弹窗 | true | 否 |
image | string | 广告图片地址 | '' | 是 |
aui-poster显示:
_this.$refs.poster.show();
插件引入示例:
<button class="aui-btn aui-btn-blue" @click.top="showPoster($event)">显示弹窗</button>
<aui-poster
ref="poster"
:mask="auiPoster.mask"
:maskTapClose="auiPoster.maskTapClose"
:image="auiPoster.image"
@callback="auiPosterCallback"
></aui-poster>
import {aui} from '@/common/aui/js/aui.js';
import auiPoster from '@/components/aui-poster/aui-poster.vue';
export default {
components: {
auiPoster
},
data() {
return {
auiPoster: {
mask: true,
maskTapClose: false,
image: 'https://xbjz1.oss-cn-beijing.aliyuncs.com/upload/default/share.png'
}
}
},
onShow() {
var _this = this;
},
onLoad() {
},
methods: {
showPoster(e){
var _this = this;
_this.$refs.poster.show();
},
auiPosterCallback(e){
var _this = this;
console.log(e);
}
}
}