SoFunction
Updated on 2025-04-03

Uniapp nested webview cannot return to the previous level solution

Scene:

  • Enter the homepage and automatically jump to third-party applications

Encountering problems

  • When running on the device, the previous level cannot be rolled back, and the application is directly exited;
  • Expectation: Return to the page at one level;

Solution

I personally think of temporary solutions, and I welcome you to share other methods

  • Go to home pageindex, don't load firstweb-view
  • Create a new page, example

Method one

Example: Android

onLoad() {
  	({
    	url: '/pages/webview/webview'
  	})
}

<template>
	<view>
		<web-view src="https://xxx"></web-view>
	</view>
</template>
onUnload() {
  	// #ifdef APP-PLUS
  	// ios exit application method, the following is written  	(); // Force quit the app.Android    // #endif
},

Method 2

Personal Recommendation method 1, simpler

  • Defining global variables or local storage identities can be done by identifying whether the webview page has been loaded.
  • OnShow determines whether the webview page has been loaded. If it has been loaded, then executes to exit the application, otherwise the page will be jumped.

globalData: {
  webShowed: false, // Logo},

const app = getApp()

onShow() {
 	();
}
handleLaunchJump() {
  let sysInfo = ();
  // Here I handle Android, Ios, jump and exit methods, according to personal needs  if (!) {
    if ( === 'ios') {
      ({
        url:  // '/pages/webview/webview'
      })
    } else {
      ({
        url: 
      })
    }
  } else {
    // #ifdef APP-PLUS
    if ( === 'ios') {
      ('UIApplication').sharedApplication().performSelector('exit');
    } else {
      ();
    }
    // #endif
  }
}

<template>
	<view>
		<web-view src="https://xxx"></web-view>
	</view>
</template>
onShow() {
  getApp(). = true;
},

Attachment: Solve the problem of uniapp using web-view to nest H5 pages and return to exit directly

<template>
  <view>
    <web-view :src="src"></web-view>
  </view>
</template>
<script>
var wv; //The webview planned to be createdexport default {
  data() {
    return {
      src: "",
      canBack: false,
    };
  },
  onBackPress() {
    if (wv &amp;&amp; ) {
      ();
      return true;
    }
    return false;
  },
  onReady() {
    // #ifdef APP-PLUS

    var self = this;
    var currentWebview = this.$scope.$getAppWebview(); //This object is equivalent to () in html5plus.  In uni-app, use of () directly on vue page is invalid, use this.$.$getAppWebview() in non-v3 compilation mode    setTimeout(function () {
      wv = ()[0];
      (
        "progressChanged",
        function (e) {
          (function (e) {
             = ;
          });
        },
        false
      );
    }, 500); //If it is a page initialization call, it needs to be delayed
    // #endif
  },
};
&lt;/script&gt;

Summarize

This is the article about the solution that cannot return to the previous level of uniapp nested webview. This is all about this article. For more related uniapp nested webviews that cannot return to the previous level, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!