wx小程序postMessage

2024-10-03

微信小程序的坑之wx.miniProgram.postMessage

工作中有个需求是小程序的网页在关闭的时候,需要回传给小程序一个参数查阅小程序官方文档,有这样一个接口 wx.miniProgram.postMessage ,可以用来从网页向小程序发送消息,然后通过 bindmessage 事件来监听消息,如下是官方文档描述微信小程序相关文章微信小程序发送模板消息!附前端+后端源码~ 微信小程序之登录态的探索开发微信小程序必须要知道的事以下是代码: // 网页代码 <!DOCTYPE html> <html> <head> &

wx小程序获取用户位置信息

wx小程序内置的接口只能获取用户的坐标,通过微信位置服务获取用户地址: http://lbs.qq.com/qqmap_wx_jssdk/index.html 注:需要在key的设置中打开webService并设置,小程序的合法域名(当前小程序的服务器域名)为允许ip

wx小程序初体验

小程序最近太火,不过相比较刚发布时,已经有点热度散去的感觉,不过这不影响我们对小程序的热情,开发之前建议通读下官网文档,附链接:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=201716 接下来,我们要实现的小程序效果如下,源码地址:https://github.com/caiya/weapp-ywgo: 1.注册打开微信公众平台,单击"小程序",按步骤开始注册即可,附地址:https://mp.weixin.qq.com/cgi-bin/

wx小程序知识点（三）

三.封装小程序的数据请求 (1)在根目录创建utils目录,创建config.js.base.js (2)在config.js中创建config类,并将请求路径配置给config的属性restUrl,并export class Config { constructor () {} } Config.restUrl = 'http://***.cn/api/v1/' export { Config } (3)在base.js中引入config,把url赋值给base的属性 import { Con

wx小程序知识点（二）

二.WXML和HTML的异同.WXSS和CSS的异同 (1)WXML和HTML 相同点:都是用来描述页面结构的,由标签.属性组成不同点:标签名不一样,小程序标签名更少: 小程序多了 wx:if 这样的属性和 {{}} 的表达式: 小程序只能在微信开发者工具中预览,而HTML可以在浏览器中预览: 小程序对组件进行了重新封装: 小程序运行在 JS Core 内,没有DOM树和window对象,无法使用window对象和document对象 (2)WXSS和CSS 相同点:都是用来描述页面的样式不

爬取WX小程序的数据

方法一: 使用TBS工具,调试跟踪获取URL https://x5.tencent.com/tbs/guide/debug/download.html https://x5.tencent.com/tbs/guide/debug/season1.html 方法二: 下载小程序的包,反编译,查看代码或者用微信开发者工具调试跟踪 1.node.js运行环境如果没有安装nodejs,请先安装一下下载地址:https://nodejs.org/en/ 2.反编译的脚本这里提供一个Github上qw

wx小程序使用字体

1.下载项目下的字体库 2.解压复制iconfont.css中的代码到,小程序 app.wxss 3.使用: //icon-begindate表示开始时间的图标 <text class="iconfont icon-begindate">{{begindate}}</text> 4.在线: 生成在线链接后,替换 app.wxss中的 @font-face

wx小程序获取组件属性数据data-prop

在微信小程序中有时会在组件上定义一些属性,使用data-来定义 <view data-idvalue="id" data-Index-Name="IndexName" data-IndexText="IndexName" data-indexValue="indexValue" bindtap='viewClick' >我要获取组件的data-属性名的值</view> viewClick: functi

wx小程序的学习

传送门: # 微信小程序案例大全 https://www.cnblogs.com/icyhoo/p/6282574.html # 微信小程序开发工具 https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html # 内置组件 https://mp.weixin.qq.com/debug/wxadoc/dev/component/ # 微信内置API https://mp.weixin.qq.com/debug/wxadoc/de

wx 小程序开发---开发者工具使用

1:右侧详情界面合法域名都要在需要在小程序平台配置合法域名这样你的小程序请求的网址才能通. 1.2如果自己的域名没有配置https 可以勾选为不校验合法域名即可 (小程序官方规定网址必须是Https).

wx小程序知识点（八）

八.小程序的优劣势优势: ① 不需要下载 ② 打开速度快 ③ 开发成本低 ④ 安卓上可以添加在桌面,与原生 App 相似 ⑤ 小程序的发布审查流程比较严格,安全保障劣势: ① 页面大小不能超过1M,不能打开超过5个层级的页面 ② 部分组件样式不可修改 ③ 推广面窄,只能分享给朋友,不能分享到朋友圈, ④ 依赖微信的后台,无法开发后台管理功能

wx小程序知识点（七）

七.小程序提速与性能优化参考大佬vicyao的文章 https://blog.csdn.net/wetest_tencent/article/details/61196522 (1)提高页面加载速度在页面加载时预加载下一个页面的数据 (2)用户行为预测根据数据分析,进入首页的用户通常会点击第二个页卡,因此提前将第二个页卡的数据存入缓存中 (3)减少默认data的大小打开一个新页面时微信会深拷贝一个page对象,因此,应该尽量减少默认data的大小,以及减少对象内的自定义属性. (4)组件

wx小程序知识点（六）

六.生命周期 (1)onLoad —— 加载时触发,只调用一次,可用来发送请求绑定数据.获取url中参数 (2)onShow —— 页面显示时触发,每次显示都会执行,用来获取需要频繁更新的数据,比如购物车.订单.地址等 (3)onReady —— 渲染完时触发,只调用一次 (4)onHide —— 隐藏页面时触发,如底部tab切换到别的页面或小程序切入后台等 (5)onUnload —— 页面卸载时触发,如redirectTo 或 navigateBack 到其他页面

wx小程序知识点（五）

五.双向绑定和 vue 的区别 ① vue 中实现双向绑定只需要修改 this.data var vm = new Vue({ el: '#example', data: { message: 'Hello' }, computed: { // 计算属性的 getter reversedMessage: function () { // `this` 指向 vm 实例 return this.message.split('').reverse().join('') } } }) ② 小程序中需要

wx小程序知识点（一）

一.微信小程序中的目录及文件 (1)project.config.json 用于开发者工具配置主要用于设置项目是否开启https校验(setting.urlCheck) (2) App.js 设置全局基础数据(记录日志.微信登录.获取用户信息) (3)App.json 底部tab(tabbar.list).标题栏(window).路由(pages) (4)App.wxss 公共样式(引入iconfont.container等) (5)pages目录包含每一个具体的页面目录 (6)index目

wx小程序笔记

目录 p18 事件绑定1 p19 事件绑定2 btn p20+ view 相关,wxss,less,css 零基础玩转微信小程序[黑马程序员] https://www.bilibili.com/video/av73342655 p18 事件绑定1 p19 事件绑定2 btn p20+ view 相关,wxss,less,css

wx小程序用canvas生成图片流程与注意事项

1.需要画入canvas的图片都需要先缓存到本地 let ps = [] ps.push(that.loadImageFun(this.statusInfo.avatar_url, "headImg")) Promise.all(ps).then(res => { // 画图 }) loadImageFun(url, index) { let _this = this return new Promise((resolve, reject) => { wx.downloa

wx小程序功能总结

注:1. 微信默认的宽度为750rpx , 不会变化. 2.bindtap 绑定触摸事件,可冒泡 catchtap 绑定触摸事件,不可冒泡 1.唤出系统菜单 2.上传图片 showSelection(sizeType,count){ let _this = this; wx.showActionSheet({ itemList: ['拍照片', '我的相册'], success(e) { switch (e.tapIndex) { case 0: { wx.chooseImage({ count

wx小程序入门&坑

1.腾讯云的nodejs版服务代码,在本地用吹cnpm install安装依赖之后,初始化数据库不成功: 换成npm install 并 npm run initdb 之后可以了.... 2.屏蔽页面的上下拉刷新: page的json配置中: { "disableScroll": true } 3.上下滑动一定要用 scroll-view 组件哦! 不然页面滑动没有加速效果. 4.scroll-view 中包含的 view 的margin-bottom 不起效: 增加一个空view

wx小程序自定义组件与页面之间参数传递

在开发中,很多页面中会使用相同的组件,这时可以将具有相同信息的部分封装成一个组件,方便开发中调用.在调用中可能会涉及到数据的传递问题,例如页面与组件,组件与组件直接的数据传递. 首先看看页面与组件直接的数据传递. 1. 组件需要获取页面传递数据, 可以使用组件的属性来传递值 2. 页面需要获取组件中修改的数据, 可以使用组件中的事件触发页面中定义的事件来获取第一.组件获取页面中数据先创建一个自定义组件test-component <!--components/test-component/t

wx小程序知识点（四）

四.页面间数据传递和参数传值 (1)页面间数据传递 ① 全局变量 ② 页面跳转或重定向时使用url携带参数(wx.navigateTo(urlStr)) ③ 使用组件模板 template <template is="products" data="{{products: productsArr}}"></template> ④ 存入缓存 wx.setStorageSync(key, data) wx.getStorageSync(key

wx小程序postMessage

热门专题