一、快手短视频推广-路由方式
快手广告推广-对于路由的触发方式以及页面生命周期函数如下:
| 路由方式 | 触发时机 | 路由前页面 | 路由后页面 |
|---|---|---|---|
| 初始化 | 小程序打开的第一个页面 | onLoad, onShow | |
| 打开新页面 | 调用 API ks.navigateTo 使用组件 <navigator open-type="navigateTo"/> |
onHide | onLoad, onShow |
| 页面重定向 | 调用 API ks.redirectTo 使用组件 <navigator open-type="redirectTo"/> |
onUnload | onLoad, onShow |
| 页面返回 | 调用 APIks.navigateBack 使用组件<navigator open-type="navigateBack">用户按左上角返回按钮 |
onUnload | onShow |
| Tab 切换 | 调用 API ks.switchTab 使用组件 <navigator open-type="switchTab"/>用户切换 Tab |
各种情况请参考下表 | |
| 重启动 | 调用 API ks.reLaunch 使用组件 <navigator open-type="reLaunch"/> |
onUnload | onLoad, onShow |
Tab 切换对应的生命周期(以 A、B 页面为 Tabbar 页面,C 是从 A 页面打开的页面,D 页面是从 C 页面打开的页面为例):
| 当前页面 | 路由后页面 | 触发的生命周期(按顺序) |
|---|---|---|
| A | A | Nothing happend |
| A | B | A.onHide(), B.onLoad(), B.onShow() |
| A | B(再次打开) | A.onHide(), B.onShow() |
| C | A | C.onUnload(), A.onShow() |
| C | B | C.onUnload(), B.onLoad(), B.onShow() |
| D | B | D.onUnload(), C.onUnload(), B.onLoad(), B.onShow() |
| D(从转发进入) | A | D.onUnload(), A.onLoad(), A.onShow() |
| D(从转发进入) | B | D.onUnload(), B.onLoad(), B.onShow() |
Tips:
navigateTo, redirectTo 只能打开非 tabBar 页面。
switchTab 只能打开 tabBar 页面。
reLaunch 可以打开任意页面。
页面底部的 tabBar 由页面决定,即只要是定义为 tabBar 的页面,底部都有 tabBar。
调用页面路由带的参数可以在目标页面的 onLoad 中获取。
Page(Object object)
注册小程序中的一个页面。接受一个 Object 类型参数,其指定页面的初始数据、生命周期回调、事件处理函数等。
| 属性 | 类型 | 说明 |
|---|---|---|
| data | Object | 页面的初始数据 |
| onLoad | function | 生命周期回调—监听页面加载 |
| onShow | function | 生命周期回调—监听页面显示 |
| onReady | function | 生命周期回调—监听页面初次渲染完成 |
| onHide | function | 生命周期回调—监听页面隐藏 |
| onUnload | function | 生命周期回调—监听页面卸载 |
| onPullDownRefresh | function | 监听用户下拉动作 |
| onReachBottom | function | 页面上拉触底事件的处理函数 |
| onPageScroll | function | 页面滚动触发事件的处理函数 |
| onResize | function | 页面尺寸改变时触发 |
| onShareAppMessage | function | 分享、视频挂载、收藏等操作触发 |
| 其他 | any | 开发者可以添加任意的函数或数据到 Object 参数中,在页面的函数中用 this 可以访问 |
示例代码
//index.js
Page({
data: {
text: 'This is page data.',
},
onLoad: function (options) {
// Do some initialize when page load.
},
onShow: function () {
// Do something when page show.
},
onReady: function () {
// Do something when page ready.
},
onHide: function () {
// Do something when page hide.
},
onUnload: function () {
// Do something when page close.
},
onPullDownRefresh: function () {
// Do something when pull down.
},
onReachBottom: function () {
// Do something when page reach bottom.
},
onPageScroll: function () {
// Do something when page scroll
},
onResize: function () {
// Do something when page resize
},
onShareAppMessage: function () {
// return share data when user share.
},
// Event handler.
viewTap: function () {
this.setData(
{
text: 'Set some data for updating view.',
},
function () {
// this is setData callback
},
);
},
customData: {
hi: 'MINA',
},
});

data
data 是页面第一次渲染使用的初始数据。
生命周期回调函数
生命周期的触发以及页面的路由方式详见
onLoad(Object query)
页面加载时触发。一个页面只会调用一次,可以在 onLoad 的参数中获取打开当前页面路径中的参数。
参数:
| 名称 | 类型 | 说明 |
|---|---|---|
| query | Object | 打开当前页面路径中的参数 |
onShow()
页面显示/切入前台时触发。
onReady()
页面初次渲染完成时触发。一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互。
注意:对界面内容进行设置的 API 如 ks.setNavigationBarTitle,请在 onReady 之后进行。详见生命周期
onHide()
页面隐藏/切入后台时触发。 如 ks.navigateTo 或底部 tab 切换到其他页面,小程序切入后台等。
onUnload()
页面卸载时触发。如 ks.redirectTo 或 ks.navigateBack 到其他页面时。
页面事件处理函数
onPullDownRefresh()
监听用户下拉刷新事件。
需要在 app.json 的 window 选项中或页面配置中开启 enablePullDownRefresh。可以通过 ks.startPullDownRefresh 触发下拉刷新,调用后触发下拉刷新动画,效果与用户手动下拉刷新一致。当处理完数据刷新后,ks.stopPullDownRefresh可以停止当前页面的下拉刷新。
onReachBottom()
监听用户上拉触底事件。
可以在 app.json 的 window 选项中或页面配置中设置触发距离onReachBottomDistance。 在触发距离内滑动期间,本事件只会被触发一次。
onPageScroll(Object object)
监听用户滑动页面事件。
| 属性 | 类型 | 说明 |
|---|---|---|
| scrollTop | Number | 页面在垂直方向已滚动的距离(单位 px) |
注意:请只在需要的时候才在 page 中定义此方法,不要定义空方法。以减少不必要的事件派发对渲染层-逻辑层通信的影响。 注意:请避免在 onPageScroll 中过于频繁的执行 setData 等引起逻辑层-渲染层通信的操作。尤其是每次传输大量数据,会影响通信耗时。
onResize(Object object)
小程序屏幕旋转时触发。
onShareAppMessage(Object object)
监听用户所有分享行为,并自定义分享内容。
分享行为包括以下场景:
右上角菜单的分享按钮
右上角菜单的收藏本页和设为常用
右上角菜单的稍后再看
button 组件的 share 和 favorite 行为,绑定短视频挂载
注意:只有定义了此事件处理函数,右上角菜单才会显示“分享”按钮
Object 参数说明:
| 参数 | 类型 | 说明 |
|---|---|---|
| from | String | 分享事件来源。button:页面内转发按钮;menu:右上角转发菜单 |
| type | String | 配置类型,标明当前通过这个方法设置的内容用来配置在什么地方 |
| target | String | 如果 from 值是对象,则 target 是触发这次转发事件的 button 组件,否则为 undefined |
type 参数说明:
| 值 | 说明 |
|---|---|
| share | 配置到分享内容 |
| plc | 配置到左下角视频挂载 |
| favorite | 配置到收藏行为 |
| live | 配置到直播挂载 |
| watchLater | 配置到稍后再看 |
Page 接口中如果定义了 onShareAppMessage 则本页面自动开启分享。同时,onShareAppMessage 的返回值会作为分享的内容。返回值的 title 为分享标题,imageUrl 为分享图标,path 为当前页面路径。当开发者自定义了分享标题 " title ",挂载在短视频上的标题继承该处指定 ; 自定义 " path " 时可在路径上追加参数以区分不同分享带来的转化 。
示例代码:
// pages/index.js
Page({
...
onShareAppMessage(shareInfo){
const { from, type } = shareInfo;
return {
imageUrl: '',
title: '',
path: '',
}
},
...
})
注意,如果onShareAppMessage执行报错,会中断分享行为,并弹出分享失败toast弹窗。
组件事件处理函数
Page 中还可以定义组件事件处理函数。在渲染层的组件中加入事件绑定,当事件被触发时,就会执行 Page 中定义的事件处理函数。
Page.route
到当前页面的路径,类型为 String。
Page({
onShow: function () {
console.log(this.route);
},
});
Page.prototype.setData(Object data, Function callback)
setData 快手推广函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的 this.data 的值(同步)。
参数说明:
| 字段 | 类型 | 必填 | 描述 |
|---|---|---|---|
| data | Object | 是 | 这次要改变的数据 |
| callback | Function | 否 | setData 引起的界面更新渲染完毕后的回调函数 |
Object 以 key: value 的形式表示,将 this.data 中的 key 对应的值改变成 value。其中 key 可以以数据路径的形式给出,快手短视频广告支持改变数组中的某一项或对象的某个属性,如 array[2].message,a.b.c.d,并且不需要在 this.data 中预先定义。
注意:
直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的,还会造成数据不一致。仅支持设置可 JSON 化的数据。单次设置的数据不能超过 1024kB,请尽量避免一次设置过多的数据。请不要把 data 中任何一项的 value 设为 undefined ,否则这一项将不被设置并可能遗留一些潜在问题。
目前选择投快手广告的人也越来越多,很多人都选择在王尘宇广告进行快手的广告投放!王尘宇广告八年互联网从业经验。团队完善,分工明确,能提供广告账户开通,账户内容策划、素材制作到广告上线,包括广告上线之后的账户跟踪优化、投放结果分析等全流程的服务,广告咨询电话:15502933391
文章均来自互联网如有不妥请联系作者删除QQ:314111741 地址:http://www.mqs.net/post/8881.html
添加新评论