详解微信小程序开发之formId使用(模板消息)


Posted in Javascript onAugust 27, 2019

基于微信小程序的模板消息:

官方文档

  • 基于微信的通知渠道,我们为开发者提供了可以高效触达用户的模板消息能力,以便实现服务的闭环并提供更佳的体验。
  • 模板推送位置:服务通知
  • 模板下发条件:用户本人在微信体系内与页面有交互行为后触发,详见下发条件说明
  • 模板跳转能力:点击查看详情仅能跳转下发模板的该帐号的各个页面

使用案例

场景描述:前台获取 formId 送至后台,由后台实现模板消息的发送。(此处由于 formId 只能由用户触发表单提交操作产生,故前台需要将每次产生的formId发送至后台,由后台保存并在适当时候调用微信接口向用户发送模板消息)

代码实现:

//example.wxml
<form bindsubmit="submit" report-submit='true' >
 <button form-type="submit" type="default" size="mini">提交</button>
</form>
 
//example.js
submit: function (e) {
 console.log(e.detail.formId);
}

注意:因为我们是在开发者工具中测试,所以得到的formId值为the formId is a mock one。在真机中我们可以得到一个具体的值,利用该值结合其他参数就可以发送模板消息啦,所以测试真实场景务必在真机中测试

微信目前的限制是在如下两种情况下小程序才能够正常的使用模板消息:

  1. 在小程序内使用了微信支付接口,
  2. 在小程序里用户点击了表单,而且该表单的report-submit属性值为true时。

index.wxml

<navigator class="navs" url="{{urls}}">
  中国
</navigator>

index.js

Page({
 data: {
  urls:'/pages/lanbo/lanbo?title=我是Index里面的title数据'
 }
})

要跳转的页面lanbo页面

lanbo.wxml

<text>pages/lanbo/lanbo.wxml</text>

lanbo.js

Page({
 data: {
 
 },
 onLoad: function (options) {
  this.setData({
   title:options.title
  });
  console.log(this.data.title);
 }
})

跳转页面之后请在调试模式下中的console下查看数据。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
点击button获取text内容并改变样式的js实现
Sep 09 Javascript
JS动态修改图片的URL(src)的方法
Apr 01 Javascript
HTML5+setCutomValidity()函数验证表单实例分享
Apr 24 Javascript
JavaScript数组实现数据结构中的队列与堆栈
May 26 Javascript
Vue.js中数组变动的检测详解
Oct 12 Javascript
老生常谈jquery中detach()和remove()的区别
Mar 02 Javascript
vue-router中的hash和history两种模式的区别
Jul 17 Javascript
vue解决使用webpack打包后keep-alive不生效的方法
Sep 01 Javascript
vue组件之间的数据传递方法详解
Apr 19 Javascript
Vue使用Proxy监听所有接口状态的方法实现
Jun 07 Javascript
vue实现公告栏文字上下滚动效果的示例代码
Jun 16 Javascript
解决Vue router-link绑定事件不生效的问题
Jul 22 Javascript
在vue项目中使用codemirror插件实现代码编辑器功能
Aug 27 #Javascript
vue使用codemirror的两种用法
Aug 27 #Javascript
微信小程序中为什么使用var that=this
Aug 27 #Javascript
JS常见面试试题总结【去重、遍历、闭包、继承等】
Aug 27 #Javascript
微信小程序模板消息限制实现无限制主动推送的示例代码
Aug 27 #Javascript
jQuery实现判断滚动条滚动到document底部的方法分析
Aug 27 #jQuery
JS多个表单数据提交下的serialize()应用实例分析
Aug 27 #Javascript
You might like
浅谈PHP强制类型转换,慎用!
2013/06/06 PHP
php中注册器模式类用法实例分析
2015/11/03 PHP
PHP中session跨子域的三种实现方法
2016/07/25 PHP
Yii CDBCriteria常用方法实例小结
2017/01/19 PHP
Laravel中七个非常有用但很少人知道的Carbon方法
2017/09/21 PHP
PHP获取当前时间不准确问题解决方案
2020/08/14 PHP
js 实现无缝滚动 兼容IE和FF
2009/07/15 Javascript
基于jquery的禁用右键、文本选择功能、复制按键的实现代码
2013/08/27 Javascript
JS对select控件option选项的增删改查示例代码
2013/10/21 Javascript
JavaScript中双叹号(!!)作用示例介绍
2014/04/10 Javascript
JS在可编辑的div中的光标位置插入内容的方法
2014/11/20 Javascript
了不起的node.js读书笔记之mongodb数据库交互
2014/12/22 Javascript
分享2个jQuery插件--jquery.fileupload与artdialog
2014/12/26 Javascript
javascript实现设置、获取和删除Cookie的方法
2015/06/01 Javascript
jquery mobile 实现自定义confirm确认框效果的简单实例
2016/06/17 Javascript
Nodejs 搭建简单的Web服务器详解及实例
2016/11/30 NodeJs
鼠标经过出现气泡框的简单实例
2017/03/17 Javascript
jfinal与bootstrap的登出实战详解
2017/11/27 Javascript
ReactNative 之FlatList使用及踩坑封装总结
2017/11/29 Javascript
基于vue 动态加载图片src的解决方法
2018/02/05 Javascript
vue toggle做一个点击切换class(实例讲解)
2018/03/13 Javascript
详解如何在vue-cli中使用vuex
2018/08/07 Javascript
vue.js实现会动的简历(包含底部导航功能,编辑功能)
2019/04/08 Javascript
jsonp格式前端发送和后台接受写法的代码详解
2019/11/07 Javascript
Vue 路由间跳转和新开窗口的方式(query、params)
2019/12/25 Javascript
在vue项目中封装echarts的步骤
2020/12/25 Vue.js
[02:59]DOTA2完美大师赛主赛事第三日精彩集锦
2017/11/25 DOTA
Python之reload流程实例代码解析
2018/01/29 Python
selenium+python自动化测试环境搭建步骤
2019/06/03 Python
python实现的按要求生成手机号功能示例
2019/10/08 Python
Pytorch中的variable, tensor与numpy相互转化的方法
2019/10/10 Python
tf.concat中axis的含义与使用详解
2020/02/07 Python
python 数据库查询返回list或tuple实例
2020/05/15 Python
前台接待岗位职责
2013/12/03 职场文书
小学六年级学生评语
2014/04/22 职场文书
超市开店计划书
2014/09/15 职场文书