跳至内容

【开源】王者荣耀/刺激战场等游戏的扫码登录小程序

此源码是纯前端的小程序,没有什么技术技巧,是今天有个老客户找我给这个源码增加下激励视频,为此修改完后开源

原始功能

扫码登录、亲戚计算器、手机清灰、手机检测、手持弹幕、空白昵称、字数统计、简易画板

后端

流量主

支持banner、插屏、视频前贴等类型广告

增加激励视频

  • 首先我们找到需要增加激励视频的地方,即复制扫码登录链接需要看视频后才能看

通过点击微信开发者工具中的元素查找-界面元素,可以看到复制按钮的位置

  • 看到其对应的pages为wmlq,复制按钮的监听事件是{{customItem.fz}}

那很容易在其页面的js中查找到“fz”这个数据类型,可以看到该页面绑定的所有数据都提前写在data里面

  • 接下来我们查找“王者荣耀”对应的事件函数,在该页面搜索“王者荣耀”

除了data中的关键字,还找到了该函数“王者荣耀”,可以看到绑定返回链接后执行“fuzhi”这个函数

  • 接下来只需要在“fuzhi”函数中增加相应操作即可
fuzhi: function(t) {
        var n = this.data.result;
        wx.setClipboardData({
            data: n,
            success: function(t) {
                wx.showToast({
                    title: "复制链接成功"
                })
            }
        });
    },
  • 首先加入弹窗

在微信小程序API中查看模态对话框文档:https://developers.weixin.qq.com/miniprogram/dev/api/ui/interaction/wx.showModal.html

记住,做微信小程序一定要学会看文档,很多东西是记不住的,这么好用的文档为啥不去看非得找一些乱七八糟的视频呢?

直接把文档中的示例代码拿出来,并且将“fuzhi”函数原有的功能放在确定中不就OK了吗?

fuzhi: function (t) {

        wx.showModal({
            title: '提示',
            content: '这是一个模态弹窗',
            success(res) {
                if (res.confirm) {
                    console.log('用户点击确定')
                    var n = this.data.result;
                    wx.setClipboardData({
                        data: n,
                        success: function (t) {
                            wx.showToast({
                                title: "复制链接成功"
                            })
                        }
                    })
                } else if (res.cancel) {
                    console.log('用户点击取消')
                }
            }
        })
    },
  • 接下来需要在确定后增加激励视频

我们继续看小程序官方的激励视频文档:激励视频广告 | 微信开放文档 (qq.com)

注意看这句话

激励视频广告组件默认是隐藏的,因此可以提前创建,以提前初始化组件。开发者可以在小程序页面的 onLoad 事件回调中创建广告实例,并在该页面的生命周期内重复调用该广告实例。

不难理解,在该页面加载完成的额时候激励视频组件已经创建好了,只是在用户面我们隐藏了。

那么,我们只需要将这段代码加入到page中的onLoad中就可以了,并把广告ID替换为自己的,至于onLoad这个默认函数是什么意思可以自行搜索

并在顶部将此公有变量初始化即可

这样我们的激励视频广告初始化创建就完成了,在文档中也提到了,如何使用

继续在“fuzhi”函数中的模态确认框中添加reawardedVideoAd.show()就可以了,并且把模态框文字修改一下,这样一个按钮的增加激励视频功能就完成啦!

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注