uni-app 开发小程序 web-view 返回上一页需要点击两次

最新推荐文章于 2024-08-07 19:53:19 发布

ma_s_c

最新推荐文章于 2024-08-07 19:53:19 发布

阅读量2.2k

点赞数 3

文章标签：小程序前端 uni-app

本文链接：https://blog.csdn.net/ma_s_c/article/details/122475947

版权

开发中使用web-view引入某个htm（小程序应该无法使用本地html，只能以http方式引入）。

当返回上一页时，发现需要点击两次。

猜测：应当是web-view的src中使用了变量，导致初始化和修改变量时进行了两次加载。

解决办法：web-view 添加v-if控制，从而在页面初始化时不进行web-view的渲染。在src中的变量修改完成之再后进行web-view渲染。

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

ma_s_c

关注关注

3
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

解决小程序中使用webview 返回按钮需要点击两次才能返回

一给窝里Giao的博客

03-22

6513

在开发小程序中，碰到使用web-view标签进入活动页，在返回时需要点击两次才能返回小程序，查了很多文档，通过验证找到了解决方法 1.出现原因通过小程序社区以为也是加了#wechat_redirect导致于是把参数去掉进行测试，发现还是要点击两次才能返回，猜测应该是链接里面别的重定向导致 2.解决方法在百度上查找了很多相关的解决方法，但是测试都没生效，不过天无绝人之路，还是在一位大佬的博客...

uni-app跨平台开发

o1dkdj的博客

06-15

781

Uni-app 框架提供了许多平台原生的 UI 控件和 API 的访问，但是这些控件和 API 在不同平台之间的支持和表现情况会有所不同，因此我们需要注意在编写代码时尽量避免使用不同平台独有的 API 或特性，同时要特别关注不同平台之间的差异，以便在不同平台上运行时代码能够正确地工作。Uni-app 运行在多个平台上，每个平台的特点是不同的。最后，总体来说，Uni-app 的跨平台开发提供了许多可能性和便利性，但也需要在搭建过程中注意兼容性问题，同时进行版本控制和测试，从而确保应用程序能够稳定地运行。

1 条评论您还未登录，请先登录后发表或查看评论

解决uniapp中web-view在手机端需点击两次才能返回上一页

gluttony_coder的博客

11-17

4155

问题：web-view组件在app端需返回两次才能返回上一页，在小程序和H5返回正常。通过js的方式创建web-view进行返回。

uniapp嵌入webview时返回失效或提示退出app问题

最新发布

lackdaylad的专栏

08-07

505

但是我期望的是在webview页面点返回时类似于页面体验一样, 返回上一页。pages.json (设置了一个返回按钮和首页按钮)使用uniapp原生导航时, 返回按钮提示。

uniapp 小程序 嵌套 webview 返回需要点击两次

weixin_45563734的博客

07-19

549

【代码】uniapp 小程序 嵌套 webview 返回需要点击两次。

uniapp构建H5应用场景中使用uni.navigateTo跳转页面后前进后退需要点两次问题的解决方法

WBOX路哥的博客

03-21

547

【代码】uniapp构建H5应用场景中使用uni.navigateTo跳转页面后前进后退需要点两次问题的解决方法。

uniapp的APP中使用webview的返回的问题

cooltea521的博客

03-28

2144

在使用uniapp开发APP中很多时候使用webview内嵌网页，

uni-app:从运行原理上面解决性能优化问题

01-27

【uni-app】是一款多端开发框架，它允许开发者编写一次代码，就能运行在iOS、Android、Web等不同平台上。然而，由于其非原生的特性，可能会遇到性能问题，这在React Native、Flutter等框架中也同样存在。本文将探讨...

uni-app入门学习

2401_84092508的博客

04-20

999

官方网页uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉）等多个平台。即使不跨端，uni-app同时也是更好的小程序开发框架。具有vue和微信小程序的开发经验，可快速上手uni-app为什么要去学习uni-app？

微信小程序和uni-app面试高频知识点

qq_53694927的博客

11-27

877

微信小程序和uni-app面试高频知识点

使用uni-app开发微信小程序

qq_34474585的博客

12-16

2630

文章目录1.uni-app框架介绍2.布置开发环境3.理论基础3.1开发规范3.2目录结构3.3组件3.4 常用API4.开发实践4.1页面相关4.1.1页面生命周期4.1.2创建页面4.1.3修改页面样式、功能4.1.4页面跳转4.2组件相关4.2.1组件生命周期4.2.2创建和使用组件4.2.3组件间通信5.小程序发布 1.uni-app框架介绍 uni-app 是一个使用 Vue.js 开发...

小程序 web-view组件点击两次返回才能返回小程序问题

qq_18342353的博客

03-22

1567

问题背景引用小程序web-view组件返回出现问题。问题表现采用小程序web-view组件跳转到外部网站时，需要点击两次返回才能返回到小程序。解决方法方法一：在目标网站内引入script标签。代码如下： <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.j...

微信小程序中webview授权后返回两次问题

weixin_43837268的博客

01-09

1367

window.replace使用后会返回两次。2、直接在小程序webview中配置。

小程序 多个 veb-view返回返回了两个页面_微信小程序学习心得 - 忒扎心

weixin_39828198的博客

10-23

257

我们写小程序时都要跳转页面的，也会有底部导航来进行切换这个时候就要介绍下窗口是怎样配置的要在文件里写一个tabBer对象里面在定义一个list数组里面放我们定义的几个需要切换的页面如下最多list里面可以定义6个对象在微信小程序里我们创建文件挺简单的如下图比如说就在上面图片的最下面直接写pages/文件名/文件名然后保存就行了这样文件夹就创建成功了然后我再说下小程序的文件类型...

小程序新闻详情用webview,页面点击返回需要点击两次

小怪獸丶的糖的专栏

07-29

3171

解决办法：一、引入js <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"></script> 二、处理返回 <script> window.onunload = function () { wx.mi...

小程序 多个 veb-view返回返回了两个页面_关于微信小程序 - 小兔儿_乖乖

weixin_39843847的博客

10-23

252

1.窗口配置微信小程序的配置分为全局配置，页面配置①全局配置的话，一般在根目录中配置全局决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab等。例如：②页面配置的话，是对某个文件夹中的.json文件进行配置，就比如Cate:2.小程序的代码构成一般有.js .json .wxml .wxss组成①JSON配置：JSON 是一种数据格式，并不是编程语言，在小程序中，JSON扮演的静态配置...

小程序嵌入web-view，返回键点击多次才能返回上一次的问题

阿不的专栏

02-12

3549

在小程序里嵌入web-view，如果web-view本身有跳转页面，在web-view里跳转页面后，点击小程序的返回键，并不会返回小程序的上一页，而是返回web-view的上一页。这在很多应用场景下是非常影响用户体验的，那么如何实现小程序的web-view里不管跳转多少次，点击小程序的返回键，都返回小程序的上一页呢。可以使用浏览器window.history对象，记录页面的跳转情况，然后调用原生小程序的方法回到上一页，以抖音小程序为例： <script type="text/javascr

微信小程序使用web-view跳转到外部页面返回需要点击两次问题

u013682258的博客

09-13

2595

先说一下需求; 微信小程序A页面点击按钮跳转到B页面; A页面:  <view class='needScoreView' data-gid="{{item.erweimaUrl}}" bindtap="erWeiMa"> <text class='needSocreText'>[查看详情]</text> </view> B页面: ..

微信小程序中web-view中的src值改变后页面需要退两次的问题

assassin_0302的博客

06-28

2256

参考链接：https://www.cnblogs.com/fenqi/p/11361118.html web-view既然是第二次刷新产生的，那么让只刷新第一次是不是就可以解决了，于是做了如下尝试：在B页面把A页面的web-view的src变量置为空，然后在A页面web-view上添加wx:if={{src!==''}}的条件控制，在src为空时销毁web-view，然后在B页面退回通过另一个变量把需要的url传递过去在A页面onShow，再设置src为一个我们期望的跳转url，总结一下： A页面跳

uni-app 微信小程序 web-view 通信

07-25

在 uni-app 中，可以通过使用 web-view 组件来实现微信小程序和 web 页面之间的通信。下面是一个简单的示例：在微信小程序页面中，使用 web-view 组件加载 web 页面： ```html <template> <view> <web-view src="https://your-web-page-url"></web-view> </view> </template> ``` 在 web 页面中，可以通过使用 postMessage 方法来向小程序页面发送消息： ```javascript // 发送消息给小程序页面 window.parent.postMessage('Hello from web', '*'); ``` 在微信小程序页面中，可以通过监听 web-view 组件的 message 事件来接收来自 web 页面的消息： ```javascript // 监听来自 web 页面的消息 onMessage(e) { console.log('Message from web:', e.detail.data); } ``` 通过以上方式，你可以实现微信小程序和 web 页面之间的通信。注意，web-view 组件只能在微信小程序中使用，其他平台可能需要使用不同的组件或方法来实现通信。此外，还可以利用 uni-app 提供的其他 API 和插件来实现更复杂的通信需求。