h5与小程序互相跳转,传参和获取参数
1、h5跳转到小程序
首先引入js文件
<script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
跳转方法
①跳转到小程序内页
wx.miniProgram.navigateTo({
url: '/pages/content/content',
//url: '/pages/content/content?id=1', 传参
});
②跳转到小程序tabbar页面
wx.miniProgram.switchTab({url: "/pages/index/index"})
2、小程序跳转到h5
①用webview标签,传入h5地址
<web-view src="{{path}}"></web-view>
②传参
this.setData({
path: options.path + '?data=' + '哈哈哈'
})
3、h5页面获取小程序传参
function getSearchString(key, Url) {
var str = Url;
str = str.substring(1, str.length);
var arr = str.split("?");
var obj = new Object();
for (var i = 0; i < arr.length; i++) {
var tmp_arr = arr[i].split("=");
obj[decodeURIComponent(tmp_arr[0])] = decodeURIComponent(tmp_arr[1]);
}
return obj[key];
}
var search = window.location.search;
var data = getSearchString('data', search);
4、小程序获取h5传参
onLoad方法中获取
onLoad: function (options) {
console.log(options.id);
},
h5与小程序互相跳转,传参和获取参数的更多相关文章
- 小程序页面跳转传参-this和that的区别-登录流程-下拉菜单-实现画布自适应各种手机尺寸
小程序页面跳转传参 根目录下的 app.json 文件 页面文件的路径.窗口表现.设置网络超时时间.设置多 tab { "pages": [ "pages/index/i ...
- 微信小程序页面跳转传参
1.传递参数方法 使用navigatior组件 <navigator url="/pages/pull/pull?title=lalla&name=cc" hov ...
- 微信小程序页面跳转传参方式
//实现跳转的A页面 jump: function () { let a = 1; let b = 2; wx.navigateTo({ url: '/page/vipOrder/vipOrder?d ...
- 三十七、小程序页面跳转传参参数值为url时参数丢失
当参数的值为url的时候,在options中的值没有参数“?”之后字符串被截取.例如:let url="http://baidu.com/?a=1&b=2"wx.navig ...
- 小程序页面跳转传参参数值为url时参数时 会出现丢失
当参数的值为url的时候, ?号 _ 下划线 等等 都会被 截取掉,看不到, 这样在 另一个页面 options中 截取的url就不完全 let url="http://ba ...
- 微信小程序之跳转、请求、带参数请求小例子
wx.request(OBJECT) wx.request发起的是 HTTPS 请求.一个微信小程序,同时只能有5个网络请求连接. 具体参数说明参看微信小程序官方文档-发起请求. 例: //当页面加载 ...
- 微信小程序之跨界面传参
微信小程序在两个之间传参类似js传递url拼接参数,举个例子来说吧 input自己设置参数 //index.wxml <form bindsubmit="formSubmit" ...
- 微信小程序 - bindtap等事件传参
什么是事件事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑层进行处理. 事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数. 事件对象可以携带额外信息,如 id, ...
- 微信小程序6 - 页面之间传参及通知系统封装
1. 简单传参 wx.navigateTo({ url: '/pages/demo/index/index?id=1' }) /pages/demo/index/index.js 中 onLoad(o ...
随机推荐
- Red Hat系统下安装gcc
这篇是在客户服务器上安装redis碰到的问题.服务器是RedHat,无法直接安装gcc,导致Redis无法安装的解决办法: 1.make redis时候报下面这样的错,原因就是gcc没有安装. ...
- SpringBoot中时间格式化的5种方法!
在我们日常工作中,时间格式化是一件经常遇到的事儿,所以本文我们就来盘点一下 Spring Boot 中时间格式化的几种方法. 时间问题演示 为了方便演示,我写了一个简单 Spring Boot 项 ...
- PAT甲级:1124 Raffle for Weibo Followers (20分)
PAT甲级:1124 Raffle for Weibo Followers (20分) 题干 John got a full mark on PAT. He was so happy that he ...
- P5471- K-D tree优化建图-弹跳
P5471- K-D tree优化建图-弹跳 优化建图是一种思想. 题意 有\(n\)个城市分布在小鸟岛上,有\(m\)个弹弓分布在这些城市里.因为弹弓体积大,固定麻烦,所以每个弹弓只能把小鸟弹飞到一 ...
- 【Lucas组合数定理+中国剩余定理】Mysterious For-HDU 4373
Mysterious For-HDU 4373 题目描述 MatRush is an ACMer from ZJUT, and he always love to create some specia ...
- 小鹤双拼win10一键恢复布局
起因 一直用的小鹤双拼布局,最近重装系统又要重新配置,麻烦 尝试 查找对应注册表设置,找到以下路径包含相应配置 HKEY_CURRENT_USER\Software\Microsoft\InputMe ...
- 最短路径问题 Dijkstra ——Python实现
# 最短路径算法 Dijkstra # 输入:含权有向图 G=(V,E),V={1,2,3...n} # 输出:G中顶点 1 到各个顶点地最短距离 Dijkstra算法各点权值变化情况: 1 ...
- vue、gulp、webpack踩过的坑和笔记
1.监听流错误 stream-combiner2 2.热更新Browsersync与element冲突,换成gulp-connect 3.gulp-uglify压缩js不能压缩es6 4.使用vue- ...
- DC-7靶机
仅供个人娱乐 靶机信息 下载地址:http://www.five86.com/downloads/DC-7.zip 一.主机扫描 二.信息收集 或者 python3 cmseek.py --url h ...
- etcd raft 处理流程图系列2-transport
本章给出了raftexample中使用的传输层代码,补全了上一节中传输层与raft节点(raft server和channel server)的交互细节.下图中流程的核心在于传输层中的streamRt ...