微信小程序webview内嵌H5跳转页面后没有返回按钮完美解决方案

简单的讲就是我们可以在小程序内放置一个<web-view>组件来链接我们的HTML页面了。

但是点击跳转页面的时候。页面左上角没有!!返回按钮!!导致回不去了,这不是搞笑的吗。

看了下其他的小程序,发现如果是两个小程序页面跳转的话,第二个页面的左上角是会有返回按钮的。那我们可以想到,如果在第二个页面也放个webview组件,用来显示跳转之后的链接,不就完美解决了吗?

1. 用来跳转到小程序第二个页面的代码:

(1)pages/webview/webview.wxml

         webview.wxml空白页面就可以

(2)pages/webview/webview.js       webview.js代码如下:

        Page({

          // 进入页面加载

          onLoad: function(e) {

            wx.showLoading({

              title: '加载中'

            });

          },

          onShow: function(e){

            wx.showLoading({

              title: '加载中'

            });

            wx.navigateTo ({

              url: '/pages/index/index',

            })

          },

        })

2. 微信小程序index用来嵌套<web-view>组件显示我们要跳转的H5网页

pages/index/index.wxml      index.wxml代码如下:

<view>

  <web-view src="https://www.baidu.com"></web-view>

</view>

3. app.json页面里面的代码如下:

{

  "pages": [

    "pages/webview/webview",

    "pages/index/index"

  ],

  "window": {

    "backgroundTextStyle": "light",

    "navigationBarBackgroundColor": "#fff",

    "navigationBarTitleText": "小程序名称",

    "navigationBarTextStyle": "black"

  },

  "style": "v2",

  "sitemapLocation": "sitemap.json"

}

相关推荐

  1. 程序webView

    2023-12-06 18:44:02       41 阅读
  2. 程序页面

    2023-12-06 18:44:02       63 阅读
  3. 程序页面方法

    2023-12-06 18:44:02       62 阅读
  4. 程序常见页面方式

    2023-12-06 18:44:02       36 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2023-12-06 18:44:02       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2023-12-06 18:44:02       100 阅读
  3. 在Django里面运行非项目文件

    2023-12-06 18:44:02       82 阅读
  4. Python语言-面向对象

    2023-12-06 18:44:02       91 阅读

热门阅读

  1. 运维工程师装逼完全指南

    2023-12-06 18:44:02       49 阅读
  2. 静态路由和动态路由的区别

    2023-12-06 18:44:02       67 阅读
  3. repo常用命令解析(持续更新)

    2023-12-06 18:44:02       51 阅读
  4. 流畅的Python (节选)

    2023-12-06 18:44:02       50 阅读
  5. 22.Oracle中的临时表空间

    2023-12-06 18:44:02       63 阅读
  6. oracle varchar2 和 nvarchar2的区别

    2023-12-06 18:44:02       50 阅读
  7. OpenCV中的一些图像方法记录

    2023-12-06 18:44:02       52 阅读
  8. 同步加载、异步加载、延迟加载、预加载的区别

    2023-12-06 18:44:02       64 阅读