UNPKG

6.51 kBTypeScriptView Raw
1import { ComponentType } from 'react'
2import { StandardProps, CommonEventFunction } from './common'
3interface AdProps extends StandardProps {
4 /** 广告单元id,可在[小程序管理后台](https://mp.weixin.qq.com/)的流量主模块新建
5 * @supported weapp, tt, qq
6 */
7 unitId: string
8 /** 广告自动刷新的间隔时间,单位为秒,参数值必须大于等于30(该参数不传入时 Banner 广告不会自动刷新)
9 * @supported weapp, tt
10 */
11 adIntervals?: number
12 /** 广告类型,默认为展示`banner`,可通过设置该属性为`video`展示视频广告, `grid`为格子广告
13 * @supported weapp
14 */
15 adType?: 'banner' | 'video' | 'grid'
16 /** 广告主题样式设置
17 * @supported weapp
18 */
19 adTheme?: 'white' | 'black'
20 /** 小程序应用 ID
21 * @supported swan
22 */
23 appid?: string
24 /** 小程序广告位 ID
25 * @supported swan
26 */
27 apid?: string
28 /** 广告类型:banner、feed ,需和百青藤平台上的代码位类型相匹配
29 * @supported swan, tt, qq
30 * @default feed
31 * @swan 支持 banner、feed
32 * @qq 支持 banner、card、feeds、block
33 */
34 type?: string
35 /** 更改该属性,可以触发广告刷新
36 * @supported swan
37 */
38 updatetime?: string
39 /** 广告是否在屏幕中固定展示
40 * @supported tt
41 */
42 fixed?: string
43 /** 广告的缩放比例,100 为标准尺寸
44 * @supported tt
45 * @default 100
46 */
47 scale?: string
48 /** type 为 feeds 时广告左边距(px),必须大于 0
49 * @supported qq
50 */
51 adLeft?: string
52 /** type 为 feeds 时广告上边距(px),必须大于 0
53 * @supported qq
54 */
55 adTop?: string
56 /** type 为 feeds 时广告宽度(px),默认 100%,最大值为屏幕宽度,最小值为 265
57 * @supported qq
58 */
59 adWidth?: string
60 /** type 为 feeds 时广告高度(px),最小 85,最大 160
61 * @supported qq
62 */
63 adHeight?: string
64 /** type 为 block 时请求积木广告数量(展示以实际拉取广告数量为准)
65 * @supported qq
66 * @default 1
67 */
68 blockSize?: string
69 /** type 为 block 时请求积木广告排列方向
70 * @supported qq
71 * @default landscape
72 */
73 blockOrientation?: 'vertical' | 'landscape'
74 /** 开发者工具下,type 为 banner 时,指定 banner 广告展示三图文还是单图
75 * @supported qq
76 * @default three
77 */
78 testBannerType?: 'one' | 'three'
79 /** 广告加载成功的回调
80 * @supported weapp, swan, tt, qq
81 */
82 onLoad?: CommonEventFunction
83 /** 当广告发生错误时,触发的事件,可以通过该事件获取错误码及原因,事件对象 event.detail = {errCode: 1002}
84 * @supported weapp, swan, tt, qq
85 */
86 onError?: CommonEventFunction<AdProps.onErrorEventDetail>
87 /** 广告关闭的回调
88 * @supported weapp, swan, tt
89 */
90 onClose?: CommonEventFunction
91 /** 贴片类型广告播放期间触发
92 * @supported swan
93 */
94 onStatus?: CommonEventFunction
95 /** type 为 feeds 时广告实际宽高回调
96 * @supported qq
97 */
98 onSize?: CommonEventFunction<AdProps.onSizeEventDetail>
99}
100declare namespace AdProps {
101 interface onErrorEventDetail {
102 errCode: keyof AdErrCode
103 }
104 /**
105 * 广告错误码
106 *
107 * 错误码是通过onError获取到的错误信息。调试期间,可以通过异常返回来捕获信息。
108 * 在小程序发布上线之后,如果遇到异常问题,可以在[“运维中心“](https://mp.weixin.qq.com/)里面搜寻错误日志,还可以针对异常返回加上适当的监控信息。
109 */
110 interface AdErrCode {
111 /**
112 * @illustrate 后端错误调用失败
113 * @reason 该项错误不是开发者的异常情况
114 * @solution 一般情况下忽略一段时间即可恢复。
115 */
116 1000
117 /**
118 * @illustrate 参数错误
119 * @reason 使用方法错误
120 * @solution 可以前往 developers.weixin.qq.com 确认具体教程(小程序和小游戏分别有各自的教程,可以在顶部选项中,“设计”一栏的右侧进行切换。
121 */
122 1001
123 /**
124 * @illustrate 广告单元无效
125 * @reason 可能是拼写错误、或者误用了其他APP的广告ID
126 * @solution 请重新前往 mp.weixin.qq.com 确认广告位ID。
127 */
128 1002
129 /**
130 * @illustrate 内部错误
131 * @reason 该项错误不是开发者的异常情况
132 * @solution 一般情况下忽略一段时间即可恢复。
133 */
134 1003
135 /**
136 * @illustrate 无合适的广告
137 * @reason 广告不是每一次都会出现,这次没有出现可能是由于该用户不适合浏览广告
138 * @solution 属于正常情况,且开发者需要针对这种情况做形态上的兼容。
139 */
140 1004
141 /**
142 * @illustrate 广告组件审核中
143 * @reason 你的广告正在被审核,无法展现广告
144 * @solution 请前往 mp.weixin.qq.com 确认审核状态,且开发者需要针对这种情况做形态上的兼容。
145 */
146 1005
147 /**
148 * @illustrate 广告组件被驳回
149 * @reason 你的广告审核失败,无法展现广告
150 * @solution 请前往 mp.weixin.qq.com 确认审核状态,且开发者需要针对这种情况做形态上的兼容。
151 */
152 1006
153 /**
154 * @illustrate 广告组件被封禁
155 * @reason 你的广告能力已经被封禁,封禁期间无法展现广告
156 * @solution 请前往 mp.weixin.qq.com 确认小程序广告封禁状态。
157 */
158 1007
159 /**
160 * @illustrate 广告单元已关闭
161 * @reason 该广告位的广告能力已经被关闭
162 * @solution 请前往 mp.weixin.qq.com 重新打开对应广告位的展现。
163 */
164 1008
165 }
166 interface onSizeEventDetail {
167 width: number
168 height: number
169 }
170}
171/** Banner 广告
172 * @classification open
173 * @supported weapp, swan, tt, qq
174 * @example_react
175 * ```tsx
176 * class App extends Component {
177 * render () {
178 * return (
179 * <Ad
180 * unitId=''
181 * adIntervals={60}
182 * onLoad={() => console.log('ad onLoad')}
183 * onError={() => console.log('ad onError')}
184 * onClose={() => console.log('ad onClose')}
185 * />
186 * )
187 * }
188 * }
189 * ```
190 * @example_vue
191 * ```html
192 * <template>
193 * <ad
194 * unit-id=""
195 * ad-intervals="60"
196 * `@load="onLoad"
197 * `@error="onError"
198 * `@close="onClose"
199 * />
200 * </template>
201 * ```
202 * @see https://developers.weixin.qq.com/miniprogram/dev/component/ad.html
203 */
204declare const Ad: ComponentType<AdProps>
205export { Ad, AdProps }