小程序分享功能记录;小程序页面分享给好友携带参数

需求: 现有首页index和新增车辆页add-car。
正常操作流程是:从首页index点击按钮,会携带参数id跳转到新增车辆页add-car。
现在需求是用户A从首页index携带参数id跳转到新增车辆页add-car,在add-car页面点击分享按钮,将次页面发送给微信好友(被分享者B);
微信好友(被分享者B)点击分享卡片直接打开新增车辆页add-car,然后上传信息图片,点击下一步,传递参数id调用接口。完成操作。

问题:
1.因为是将新增车辆页add-car分享给用户打开新增车辆页add-car,微信好友(被分享者B)如何获取到用户A传递的参数id就是一个问题。
2.分享页面给微信好友(被分享者B),微信好友(被分享者B)点击时候报提示:开发版小程序已过期,请在开发者工具中重新扫码;(导致原因: 这是因为你在本地测试环境分享给好友,好友没有扫码,也没有开发权限。导致的好友打不开,部署生产环境是不会有这个问题的。)

注意点:
1.onShareAppMessage(res){} 方法,在此方法内是可以配置分享哪个页面和传递参数。
2.如果只是写了 <button open-type="share">分享</button> ,那么点击这个分享按钮是可以直接分享本页面的。但是就没办法触发分享别的页面,同时小程序的右上角的三个点点点…,点击打开 那个默认分享事件也是不可选的。

一、首页index代码:点击跳转按钮需要向新增车辆页add-car传递参数id

点击跳转的按钮事件:

    addCar(item) {// 这一步是为了存入客户id 然后在添加车辆页面 通过option 拿到customer_id使用uni.setStorageSync('customer_id', item.id);let obj = {item: {id: uni.getStorageSync('customer_id')},typeValue: "add",title: "新增车辆",};uni.navigateTo({url:"/pagesA/add-car?obj= " +encodeURIComponent(JSON.stringify(obj)),});},

二、新增车辆页面add-car: 此页面存在分享按钮,分享的也是此页面,好友打开后可以获取到对应的customer_id;
(同理如果想要携带分享者既用户A的相关信息,例如登录的信息cookie等,也可以通过分享页path字符串和getStorageSync配合传参以及获取参数)

html:只需写入此按钮

 <!-- 小程序分享 必须是 按钮+open-type="share"  可以通过 v-if="flagShare" 来控制是否显示按钮   --><button open-type="share">分享</button>

data:

flagShare: true,//在正常流程首页到新增车辆页是true 在分享卡片打开页是false

js部分:

  onLoad(option) {const obj = JSON.parse(decodeURIComponent(option.obj));this.picObj.customer_id = obj.item.id// if else是为了判断当前add-car页是通过首页index打开的 还是通过点击分享卡片打开的// 判断的依据就是路径path携带的参数(在index页是不传递share属性 但是分享页分享出去的 是传递了share属性对的)if (obj.item.share) {this.flagShare = falseconsole.log('分享页打开');// 如果想要被分享者1 将此页面分享给另一个用户(被分享者2)同时传递id 那么就需要在被分享者1的缓存中存入id(既下方注释) 这样在被分享者1点击分享时候 onShareAppMessage才能获取到id进行传递// uni.setStorageSync('customer_id', this.picObj.customer_id);} else {this.flagShare = trueconsole.log('默认首页操作进来');}},// 加了此方法,才能点击分享按钮或者右上角的分享三个小点 ...onShareAppMessage(res) {let obj = {item: { id: uni.getStorageSync('customer_id'), share: true },typeValue: "add",title: "新增车辆",};if (res.from === 'button') {// 来自页面内分享按钮console.log(res.target)}// 向分享页面传参 通过字符串路径即可(在对应的分享页的onLoad获取即可)return {title: '尊敬的车主,请您上传证件!',path: "/pagesA/add-car?obj= " +encodeURIComponent(JSON.stringify(obj)),}},

三、各页面

首页index:
在这里插入图片描述

新增车辆add-car页:

在这里插入图片描述

点击发送分享按钮:

在这里插入图片描述

好友点击分享卡片打开报: 开发版小程序已过期,请在开发者工具中重新扫码(问题截图,此问题不用管,生产环境部署好,直接看生产环境的不会有此问题)

在这里插入图片描述

线上 生产环境被分享者(用户B)点击分享卡片打开的页面:
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/403617.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

mysql事务处理

2019独角兽企业重金招聘Python工程师标准>>> ACID:Atomic、Consistent、Isolated、Durable 存储程序提供了一个绝佳的机制来定义、封装和管理事务。 1&#xff0c;MySQL的事务支持 MySQL的事务支持不是绑定在MySQL服务器本身&#xff0c;而是与存储引擎相关&#x…

记录一次uni-app页面跳转无效 来回跳转问题

问题&#xff1a;本身代码写的有问题导致的。从首页A跳转到新增页面B&#xff0c;在B页面点击保存后&#xff0c;再跳到首页A。此时在首页A&#xff0c;这时候无论点击跳转哪个页面&#xff0c;跳转成功后都会立即再跳回首页。 原因&#xff1a;B页面保存后&#xff0c;因为加了…

IE6双倍边距

2019独角兽企业重金招聘Python工程师标准>>> 前言&#xff1a;IE6双倍边距这个问题其实早在学习CSS之初都已经知道如何解决&#xff0c;但当时只知道如何解决而并不知道引起这个BUG的原因是什么&#xff0c;再接下来工 作过程中不断实践也终于明白是怎么回事了。但最…

typeid详解

From: http://www.cppblog.com/smagle/archive/2010/05/14/115286.aspx 在揭开typeid神秘面纱之前&#xff0c;我们先来了解一下 RTTI &#xff08;Run-Time Type Identification&#xff0c;运行时类型识别&#xff09;&#xff0c;它使程序能够获取由基指针或引用所指向的对…

H5静态页面跳转微信小程序;从外部浏览器,点击H5链接跳转打开微信小程序;以及在微信内直接点击H5链接打开微信小程序;

参考链接 需求&#xff1a;从外部浏览器&#xff0c;点击H5链接跳转打开微信小程序&#xff1b;以及在微信内直接点击H5链接打开微信小程序&#xff1b; 步骤1&#xff1a; 小程序开发需要使用云开发创建项目&#xff0c;使用云开发生成的项目会自带云函数文件夹&#xff1b;…

c简单的链表错误及改正

2019独角兽企业重金招聘Python工程师标准>>> 以下代码运行时崩溃&#xff1a; #include <iostream> using namespace std; struct node { int num; struct node * next; }; node * creat() { node * headNULL;node*HEADhead; cout<<"输入数字&…

uni-app微信小程序跳转公众号;微信小程序打开公众号;微信小程序识别二维码添加好友;微信小程序通过公众号添加好友;小程序里识别企业微信二维码点击联系人名片无反应?

需求&#xff1a; 在微信小程序页面中&#xff0c;长按识别图片二维码&#xff0c;识别出联系人后&#xff0c;点击添加好友&#xff1b; 问题&#xff1a;微信官方社区说是小程序添加不了好友&#xff1b; 解决方案&#xff1a; 目前只能通过微信小程序跳转至公众号&#xf…

A*算法入门

From: http://www.cppblog.com/mythit/archive/2009/04/19/80492.aspx 在看下面这篇文章之前&#xff0c;先介绍几个理论知识&#xff0c;有助于理解A*算法。 启发式搜索&#xff1a;启发式搜索就是在状态空间中的搜索对每一个搜索的位置进行评估&#xff0c;得到最好的位置&a…

ThinkPHP讲解(一)框架基础

ThinkPHP框架知识点过于杂乱&#xff0c;接下来将以问题的形势讲解tp&#xff08;ThinkPHP的简写&#xff09; 1.tp框架是什么&#xff0c;为什么使用是它&#xff1f; 一堆代码的集合&#xff0c;里边有变量、函数、类、常量&#xff0c;里边也有许多设计模式MVC、AR数据库、单…

uni-app文档需要注意细节点

1.非H5端&#xff0c;不能使用浏览器自带对象&#xff0c;比如document、window、localstorage、cookie等&#xff0c;更不能使用jquery等依赖这些浏览器对象的框架。因为各家小程序快应用都不支持这些对象。 2.APP 和小程序的导航栏和 tabbar 均是原生控件&#xff0c;元素区…

VMware里装XP 没有找到硬盘驱动器

遇到问题&#xff1a;解决&#xff1a;要给虚拟机配上一个虚拟的硬盘驱动器。在VMWare的虚拟机配置里面给这个虚拟机增加硬盘&#xff0c;选IDE模式&#xff0c;而非SCSI&#xff0c;设定硬盘大小和文件名就可以了。转载于:https://www.cnblogs.com/haxianhe/p/9271196.html

serv-u无法自动启动:无法开始服务器!服务器执行缺少

我在服务器上安装了一个serv-u 6.3版本&#xff0c;安装的时候一切正常。安装后想设置为自动开设&#xff08;系统服务&#xff09;勾打上时候&#xff0c;开设报错。在服务里面查看&#xff0c;发现servu的服务器没有起来&#xff0c;手动启动也不行。网上查了很多方法&#x…

uni-app微信小程序登录;uni-app微信登录小程序;uni-app微信登录app;

思路&#xff1a; 通过uni-app文档可知:实现微信登录&#xff0c;无论是app还是小程序&#xff0c;都需要唯一标识openid&#xff0c;然后通过openid取掉后端的登录接口&#xff0c;获取cookie然后做登录跳转&#xff1b; 【-【-【必须先调用微信的登录接口uni.login&#xff0…

线性表 - 数据结构和算法06

线性表 让编程改变世界 Change the world by program 感受线性表的存在 各位鱼油大家好&#xff0c;从今天开始小甲鱼带大家开始学习第一个数据结构&#xff1a;线性表 先让我我们通过图片来感受一下&#xff0c;线性表的特性吧。 [caption id"attachment_758" a…

uni-app微信小程序获取手机号;微信小程序获取手机号,获取到后需要进行解密;微信小程序获取手机号失败 Error:该appId没有权限

方法1.uni-app登录加获取手机号解密—直接看此篇即可解决 微信小程序获取手机号注意点&#xff1a; 1.需要先登录&#xff0c;微信小程序登录看这篇 2.手机号获取到时加密的&#xff0c;需要后端解密或者前端自己解密&#xff08;解密时候就会用到登录得到的session_key&#…

Swift 3.0 on Ubuntu 15.10

一、安装swift 3.0 1. 下载 https://swift.org/download/ 找到swift-3.0 ubuntu 15.10版本下载&#xff1a; https://swift.org/builds/swift-3.0-preview-1/ubuntu1510/swift-3.0-preview-1/swift-3.0-preview-1-ubuntu15.10.tar.gz 2. 解压文件&#xff0c;然后移动改名到/op…

解决uni-app官方弹框popup关闭不了问题;/pages/extUI/popup/popup;uni-app弹框popup打开调用事件。unin-app弹框封装;

![在这里插入图片描述](https://img-blog.csdnimg.cn/20210716165216781.png?x-oss-processimage/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lfYW1fYV9kaXY,size_16,color_FFFFFF,t_70)官方uni-app的弹框popup模板问题: 官方的弹框示…

uni-app自定义tabBar;uni-app小程序自定义tabBar;uni-app小程序修改中间tabBar导航栏大小;uni-app中间导航栏凸起;uni-app修改底部导航栏

需求&#xff1a;要求小程序&#xff0c;中间的tabBar自定义凸起或者图标变大&#xff1b; 问题&#xff1a;查看uni-app的tabBar文档可知&#xff0c;小程序是不支持midButton的&#xff1b; 解决思路&#xff1a;隐藏uni-app原有的tabBar&#xff0c;然后换成自己手写的导航…

uni-app小程序 点击页面滚动到指定位置

uni.pageScrollTo({scrollTop: 0,duration: 300,})

mysql Connector C/C++ 多线程封装

From: http://blog.csdn.net/educast/article/details/14163519 在网上找了好久&#xff0c;有很多封装&#xff0c;但是感觉对多线程处理的不多&#xff0c;都不是很理想。封装完的第一个版本&#xff0c;想法比较简单&#xff0c;使用一个单例模式&#xff0c;对应一个连接&a…