uniapp 小程序 嵌套 webview 返回需要点击两次
- 先 上图
- 小程序也监听不到 返回事件
- 在网上找了一圈 都没有理想的答案,猜测 是因为嵌入的页面中有问题
- 果然
小程序中嵌入的代码
<view><web-view :src="urlSrc" ></web-view></view>export default {data() {return {urlSrc: "",}},onLoad(options) {// 这里是要嵌入的页面路径this.urlSrc = getApp().globalData.webViewUrl + "/#/viewsEdit?key=" + options.id+"&token="+options.token},}
嵌入项目 app.vue
因为我需要在该项目中先登录,再跳转到 /viewsEdit 页面 所以需要再app.vue中做默认登陆操作,然后再跳转到 /viewsEdit
<template><div id="app"><RouterView /></div>
</template><script>
export default {created() {// 有发送就有接收,与postMessage配套使用的就是message事件let that = thiswindow.onload = function () {let datas = that.getUrlParams(window.location.href)localStorage.setItem('token', datas.token)// 登录成功后路由跳回// 重点// 重点// 重点// 此处一定要使用 replace 替换掉 路由栈中的记录// 不然 路由栈中会存在 ['/','/viewsEdit'] 两个记录 所以需要点两次才能退出// 使用 replace 后 路由栈中就剩了 ['/viewsEdit'] // this.$router.push({// path: '/viewsEdit',// query: {// key: datas.key,// }// })this.$router.replace({path: '/viewsEdit',query: {key: datas.key,}})}},methods: {getUrlParams(url) {const params = {}const reg = /([^?&=]+)=([^&]*)/gurl.replace(reg, (match, key, value) => {params[decodeURIComponent(key)] = decodeURIComponent(value)})return params}}}
</script>
- 搞定 , 日常记录!