小程序 内嵌多个h5

本文介绍了一个小程序项目的需求,该需求涉及到在一个小程序内内嵌多个H5页面。通过点击特定位置,利用wx.navigateTo方法跳转到allH5Pages页面,并传递参数title。在allH5Pages页面的wxml和js中处理这些H5页面的展示。
摘要由CSDN通过智能技术生成

接触小程序不久,接手的小程序项目,都是已写好的,在原基础上新增或者优化

需求:一个小程序包含多个h5
点击某一个地方,
wx.navigateTo({
url: ‘/pages/allH5Pages/allH5Pages?title=’+‘这里面传参数title’,
})

1、建一个专门放h5的page包allH5Pages:
wxml:

<web-view src="{
  {H5Url}}"></web-view>

2、js


Page({

  data: {
    Title: "给个默认的title",
    H5Url: '' "
  },
  // 跳转到这个页面,加上title的参数,根据传参不同,src不同,自定义
  onLoad: function (options) {
    console.log("宽带的options")
    console.log(options.title)
    let url = "";
    if(options.title == 'h5链接3'){
      url = "h5链接3"
      this.setData({
        H5Url:url,
        Title: options.title   
      });
      wx.setNavigationBarTitle({
        title: options.title    // 设置顶部title内容
      })
    }
    else if(options.title =
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值