微信小程序常见问题(三)
知晓程序员,专注微信小程序开发的程序员!
一、获取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
- C# 调用PowerShell方法
- 使用Visual Studio 2010 一步一步创建Powershell Module 和 Cmdlet
- [SQLServer大对象]——FileTable初体验
- JavaScript闭包,只学这篇就会了
- [数据库基础]——编码标准之格式
- [数据库基础]——编码标准之结构
- 2017前端开发手册三-前端职位描述
- [.NET自我学习]Delegate 泛型
- [数据库基础]——图解JOIN
- ubuntu搭建内网穿透服务Ngrok
- SQL Server 性能优化之——T-SQL 临时表、表变量、UNION
- node.js 学习笔记
- SQL Server 性能优化之——T-SQL TVF和标量函数
- C# 6.0 功能预览 (一)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 前端运维部署那些事
- 《前端那些事》从0到1开发简单脚手架
- CDH7.1.1启用Kerberos
- 持续代码质量管理-SonarQube Scanner部署 2.1. 软件安装2.2. 配置修改
- 《前端那些事》聊聊前端的按需加载
- 直播带货系统,滚动视图,上滑隐藏,下滑显示
- 持续代码质量管理-SonarQube-7.3简单使用 2.1. 查看配置2.2. 质量检测2.3. 浏览器查看
- 安装指定版本的docker服务
- 你学BFF和Serverless了吗
- 如何使用Java连接Kerberos的Phoenix
- docker swarm的常用操作
- 组件库源码中这些写法你掌握了吗?
- spark-2.4.0-hadoop2.7-安装部署 4.1. Spark安装4.2. 环境变量修改4.3. 配置修改4.4. 分发到其他机器4.5. 启动spark
- spark-2.4.0-hadoop2.7-高可用(HA)安装部署 5.1. Spark安装5.2. 环境变量修改5.3. 配置修改5.4. 分发到其他机器5.5.
- spark-2.4.0-hadoop2.7-简单操作 2.1. 相关截图