首页 > 编程语言 >uniapp 小程序引流关注公众号

uniapp 小程序引流关注公众号

时间:2023-02-13 16:33:45浏览次数:46  
标签:uniapp 场景 程序 公众 关注 组件 打开 引流

official-account组件说明:

微信公众号关注组件。当用户扫小程序码打开小程序时,开发者可在小程序内配置公众号关注组件,方便用户快捷关注公众号,可嵌套在原生组件内。

仅微信小程序平台支持


用户扫码打开小程序时,开发者可在小程序内配置公众号关注组件,方便用户快捷关注公众号,可嵌套在原生组件内。
先说明一个重点啊:想使用这个组件,小程序基础库要在2.3.0及以上,要不然是不会显示的。文档上那一行小字太容易让人忽视了,反正我打眼一看是没看到。。。

 

使用注意事项:
使用组件前,需前往小程序后台,在“设置”->“接口设置”->“公众号关注组件”中设置要展示的公众号。
注:设置的公众号需与小程序主体一致。
在一个小程序的生命周期内,只有从以下场景进入小程序,才具有展示引导关注公众号组件的能力:
当小程序从扫二维码场景(场景值1011)打开时
当小程序从扫小程序码场景(场景值1047)打开时
当小程序从聊天顶部场景(场景值1089)中的“最近使用”内打开时,若小程序之前未被销毁,则该组件保持上一次打开小程序时的状态
当从其他小程序返回小程序(场景值1038)时,若小程序之前未被销毁,则该组件保持上一次打开小程序时的状态
每个页面只能配置一个该组件。
具体使用:

<view style="width:100%;position:relative;height:400rpx;background:gray;">
 <official-account style=""></official-account>
</view>

根据上面的注意事项我们知道,它并不是什么情况下都显示的,所以我在开发者工具上配置了一个场景值为1011的编译场景:

 

 那么再次说明,基础库要选对啊,要不然可是显示不出来的!!!

 

 设置完这两步,之前写好的official-account组件就可以显示出来了:

 

 

显示出来就是这样的,很省事有没有,连基本的样式都有了.

<view style="width:100%;position:relative;height:400rpx;background:gray;">
  <official-account style="position:absolute;top:0;width:81%;height:168rpx;border:1rpx solid black;"></official-account>
</view>

 

 

p.s 直接在微信首页下拉进入小程序 official-account 是不会出来的

 

 最终的解决方案是 在关联该小程序的公众号里面写一篇文章关注公众号

 

 

通过一张图片点击跳转到一个空页面

 用 web-view 标签 链接用公众号推广的url即可

 

标签:uniapp,场景,程序,公众,关注,组件,打开,引流
From: https://www.cnblogs.com/caihongmin/p/17116838.html

相关文章

  • uniapp小程序端实现身份证相机
    template:<template><view><!--选择相机拍照--><viewclass="container"><!--相机--><!--初始showcamer......
  • 如何将 Markdown 格式文章快速发布到微信公众号(转)
    转自:如何将Markdown格式文章快速发布到微信公众号如果你和我一样,平时习惯使用Markdown写作,当我们想把文章发布到微信公众号或知乎等平台时,就会发现挺麻烦的,尤其是排版......
  • 微信公众号搜索量排名
    1:公众号排名的概念微信公众号搜索量排名是根据公众号在微信内的搜索量来进行排名的。由于微信公众号的搜索是实时的,所以公众号的搜索量也是实时变化的。目前,微信公众号搜......
  • 如何在H5页面或者移动端Uniapp/vue中接入在线客服系统,h5客服系统的接入方法
    通过嵌入JS代码的方式UniApp是一个使用Vue.js框架开发的跨平台应用程序,可以在iOS、Android、H5、微信小程序、支付宝小程序、字节跳动小程序等多个平台上运行。如果要......
  • uniapp 常用hooks方法
    //抽离showToastshowToastLoading(title='...',icon='none',duration=2000){uni.showToast({title,icon,duration,......
  • uniapp踩坑必备笔记
    1.【配置】应用版本号名称有一个规则的字符串:1.0.0,规则是:大版本号,中版本号,小版本号。2.【配置】应用版本号中的小版本号不能超过9,超过9的需要向上一个版本号进一(逢十进一)......
  • 富文本编辑器实现公众号内容自动上传
    ​ 当前功能基于PHP,其它语言流程大抵相同。大概流程:1.将docx文件上传到服务器中2.使用PHPoffice/PHPword实现将word转换为HTML3.将HTML代码返回并赋值到编辑器中......
  • Uniapp---苹果IOS支付
    最近开发APP遇到苹果上架的问题,由于采用了第三方支付,由于苹果的霸王条款,所以需要完善苹果支付,以下是详细的开发流程和步骤:首先看官方文档:https://uniapp.dcloud.net.cn/......
  • 搭建直播平台,uniapp滚动条置顶实现
    搭建直播平台,uniapp滚动条置顶实现实现代码: uni.pageScrollTo({  scrollTop:0,  duration:300});​以上就是搭建直播平台,uniapp滚动条置顶实现,更多内容欢......
  • uniapp文件复制,重命名以及删除
    查找某目录下的文件plus.io.resolveLocalFileSystemURL(      "_www/static/本地.png",         function(entry){//获取文件对象       ......