微信小程序常见问题(三)

知晓程序员,专注微信小程序开发的程序员!

一、获取formId

相信使用过小程序的同学,多少都收到过小程序的通过消息,如下:

这类通知消息,是和好友消息一样展示在微信的聊天列表中,所以,点击率还是比较高的。想实现这种小程序的模板消息,就必须要获取用户的formid才可以(如何发消息,请仔细查阅小程序官方文档https://mp.weixin.qq.com/debug/wxadoc/dev/api/notice.html)

我们来说一下如何获取formId:

a、必须通过form组件提交才能获取到formId;

b、给form组件设置report-submit="true"属性;

c、给form组件添加bindsubmit事件绑定,携带 form 中的数据触发 submit 事件,event.detail = {value : {'name': 'value'} , formId: ''};

d、必须用户手动触发提交表单,不能JS模拟提交,所以,页面上必须要有提交按钮;

看一下示例代码:

<form report-submit='true' bindsubmit='userSubmit'>
  <button class='button' bindtap='copy'
          form-type='submit'>复制</button>
</form>

以上示例就可以在userSubmit里获取到formId了:

userSubmit: function (e) {
  console.log(e.detail.formId);
},

需要注意一点,开发工具里面是没办法查看到真实的formId的,会是这样一句提示"the formId is a mock one",提交给服务端就可以拿到了~

二、客服button样式

其实button样式没什么好说的,最近有几个同学在群内讨论,说是客服按钮太小,想改一下样式,没办法实现。

这里我提供个思路:先按设计稿实现界面,联系客服如果样式和官方给的不一样,那就用position: absolute,定位一个button到你想要的位置,透明度设置为0即可,同时给button设置属性open-type="contact"就ok了~

注:

1、这里要注意button的open-type属性是在基础库1.1.0开始支持的,自己要做一下兼容处理~

2、button也可以改成其他样式,有些同学为了获取formId,就把页面所有可点击区域都用button按钮来实现了~

三、区分转发的是群聊还是好友

这个其实就是场景值的判断,先看一张图:

上图可以看出,从好友聊天窗口和群聊窗口点击小程序卡片后,场景值是不一样的,分别是1007和1008,所以,我们可以在app的onLuanch或者onShow方法中去获取到scene值,这样就能知道用户是通过哪种方式进入小程序的~

四、小程序组件化开发

小程序官方提供的组件化文案,这里不细说,大家直接去github查看吧: https://github.com/Tencent/wepy

原文发布于微信公众号 - 知晓程序员(bainaweb)

原文发表时间:2018-01-17

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏我的小碗汤

【插件】解放鼠标,让浏览器更智能

首先感谢大家参与这周的送书活动。已经给小助手微信发送好友请求的,不要着急,这两天会通过验证,并拉大家进入抽奖群参与抽奖,大家肯定都可以参与的。

722
来自专栏Android机动车

我的第一个RN项目——趣闻

之前利用自己的业余时间入门了微信小程序,并写了一个入门项目 我的第一个微信小程序-趣闻 ,整体效果和之前写的 kotlin-android 版的 趣闻 模块和功...

261
来自专栏冰霜之地

WWDC2016 Session笔记 - iOS 10  推送Notification新特性

在今年6月14号苹果WWDC开发者大会上,苹果带来了新的iOS系统——iOS 10。苹果为iOS 10带来了十大项更新。苹果高级副总裁Craig Federig...

582
来自专栏魏艾斯博客www.vpsss.net

宝塔面板优化补充内容及添加 CC 防护

自从写了如何设置宝塔面板优化 php 服务器性能这篇文章后,很多网友纷纷向魏艾斯博客反应帮到他们了,按照教程操作后 wordpress 提速很大,不像以前那么卡...

1221
来自专栏张戈的专栏

SendCloud邮件队列状态和已使用额度的Python监控脚本

公司最近用上了 SendCloud 的邮件代发服务,于是就有了各种监控需求。比如每天发信额度是不是要超标了或是邮件是否堵塞了等等。最近经常接触 python,所...

3199
来自专栏木头编程 - moTzxx

Android 学习链接,资源,博客(备忘)

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u011415782/article/de...

702
来自专栏视频咖

腾讯视频云 LiteAVSDK 升级到 5.2.5541

4.9 版本开始,短视频licence开始支持自动续期,如果有使用短视频功能申请过licence,请关注:

1282
来自专栏SAP梦心的SAP分享

良好的用户体验的几条箴言

30、要认为:所有的用户都是小白,傻瓜,记忆力差,懒癌晚期,不耐烦,不懂电脑,不会用手机,网速差,会乱操作的人。以此前提去设计UE;

2297
来自专栏性能与架构

微信风格的UI库 - WeUI

微信官方的设计团队设计制作以一套 UI 库,是与微信界面体验一致的基础样式库 包含button按钮、dialog对话框、toast提示框、article文章、...

3776
来自专栏腾讯移动品质中心TMQ的专栏

H5前端性能测试快速入门

前言 说到H5测试,对于做WEB测试的同学来说再熟悉不过了,它包括页H5功能测试,前端性能测试,浏览器兼容性能测试,以及服务端性能测试。那本文谈到...

2156

扫码关注云+社区