快手广告投放-快手小程序(开发-框架)06

一、快手短视频推广-路由方式


快手广告推广-对于路由的触发方式以及页面生命周期函数如下:

路由方式 触发时机 路由前页面 路由后页面
初始化 小程序打开的第一个页面
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',

    },

});


快手广告投放-快手小程序(开发-框架)06


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

相关阅读

添加新评论