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 ...
随机推荐
- MIT6.828 Lab4 Preemptive Multitasking(下)
Lab4 Preemptive Multitasking(下) lab4的第二部分要求我们实现fork的cow.在整个lab的第一部分我们实现了对多cpu的支持和再多系统环境中的切换,但是最后分析的时 ...
- C语言:字符编码
C语言是 70 年代的产物,那个时候只有 ASCII,各个国家的字符编码都还未成熟,所以C语言不可能从底层支持 GB2312.GBK.Big5.Shift-JIS 等国家编码,也不可能支持 Unico ...
- mysql 修改my.ini
1.C:\Program Files\MySQL\MySQL Server 5.5\bin>mysqladmin shutdown可能提示:localhost不能启动mysql2.C:\Prog ...
- 实验 2 Scala 编程初级实践
实验 2 Scala 编程初级实践 一.实验目的 1.掌握 Scala 语言的基本语法.数据结构和控制结构: 2.掌握面向对象编程的基础知识,能够编写自定义类和特质: 3.掌握函数式编程的基础知识,能 ...
- 以太坊-Win环境下remix环境搭建
一.node.js环境搭建 有多个安装方法,但是注意npm与node版本相关性较强!以下方案较为简便 1.下载网址 http://nodejs.cn/download/ 2.下载window 64位 ...
- C语言学习之基本数据类型【一】
近期学习鸿蒙硬件物联网开发,用到的开发语言是C: 一.基础语法:第一个案例: 命令 gcc hello.c #include <stdio.h> //stdio.h 是一个头文件 , #i ...
- 纯C语言(C89)实现简单链表
起因 工作很少接触纯C项目,业余写着玩玩,不断雕琢 目标 纯C实现简单链表,提供方便易用泛型接口,避免依赖 实现 完全封装,隐藏结构体细节,不支持栈创建 拷贝存储,轻微性能代价换来易用性 list.h ...
- jvm源码解读--16 锁_开头
现在不太清楚, public static void main(String[] args) { Object object=new Object(); System.out.println(&quo ...
- 使用JavaMailSender 发送邮件
使用JavaMailSender 发送邮件 package com.juvenxu.mvnbook.account.email; import javax.mail.MessagingExceptio ...
- Oracle 对 sql 的处理过程
当你发出一条 sql 语句交付 Oracle,在执行和获取结果前,Oracle 对此 sql 将进行几个步骤 的处理过程: 1.语法检查(syntax check) 检查此 sql 的拼写是否语法 ...