1.0.15 • Published 1 year ago
fs-ali-ad-component v1.0.15
fs-ali-ad-component 支付宝广告组件
使用前准备
在 request合法域名
中增加如下配置
https://ad-server.51youdian.com
https://event-upload.51youdian.com
https://fshows-ecs-pro.cn-hangzhou.log.aliyuncs.com
使用方法
一. npm 安装
npm install fs-ali-ad-component --save
二. 使用
- 开发者工具中启用component2
- 引入组件,页面的 json 文件中做如下配置
{
"usingComponents": {
"fs-ad": "fs-ali-ad-component"
}
}
- 页面的 axml 文件
<fs-ad
a:if="{{showFsAd}}"
ref="fsAd"
adLabel="xxx"
openId="xxx"
onInfoReady="handleOpenAd"
/>
注意
- 如果在新开页面接入组件,需要添加onInfoReady属性,用于获取到广告后立即展示广告。
如果组件接在支付页,支付完成后不跳页面,那么不需要写onInfoReady,只需要在支付完成的回调中去调用handleOpenAd方法即可。
- 页面的js文件,展示广告
注意:showFsAd在data中的初始值应设置为false
Page({
data: {
showFsAd: false // showFsAd在data中的初始值应设置为false
},
onLoad () { // 获取广告
this.setData({
showFsAd: true
})
},
fsAd (ref) {
this.fsAdRef = ref // 通过ref获取广告方法
},
/**
* @function 展示广告
*/
handleOpenAd () {
this.fsAdRef.showAd()
}
})
三. 参数说明
变量 | 类型 | 必填 | 说明 |
---|---|---|---|
openId | String | 是 | 用户 openId |
adLabel | String | 是 | 流量位标识, 运营提供的字段 |
serverUrl | String | 否 | 测试beta地址 (配合调试时配置,默认不传) |
四.事件
事件名称 | 参数 | 必填 | 说明 |
---|---|---|---|
onInfoReady | 无 | 否 | 广告数据获取成功的回调函数 |
Tips
- 如果你的必传参数中,有异步获取的,请通过a:if,在获取参数后再进行组件的一个显示,以防提示缺少必传参数