uni-app 实现navigateBack返回修改前一页面数据（H5、APP、小程序）
<blockquote><p>B页面返回修改A页面title的值</p>
</blockquote>
<pre><code>//A页面
<template>
<text class="title">返回修改的值：{{title}}</text>
</template>
export default {
data() {
return {
title: 'Hello'
}
},
}
//B页面
<button @click="change">修改上一页的title值</button>
</code></pre>
<h3 id="方案一-getcurrentpages">方案一： getCurrentPages()</h3>
<p>注：虽然都是通过getCurrentPages，但H5和APP/小程序通过getCurrentPages打印出来的前一页面的结构是不同的。</p>
<h5 id="h5">H5</h5>
<pre><code class="language-js">change(e){
var pages = getCurrentPages();
var currPage = pages; //当前页面
var prevPage = pages;//上一个页面
//将前一页的title修改为"Hello World"
prevPage._data.title ='Hello World'
//因为修改的是data里面的绑定数据，所以返回后页面数据会直接显示修改后的
uni.navigateBack()
},
</code></pre>
<h5 id="app小程序">APP/小程序</h5>
<pre><code class="language-js">//B页面
change(e){
var pages = getCurrentPages();
var currPage = pages; //当前页面
var prevPage = pages;//上一个页面
//console.log(prevPage ); //按照打印结构这样赋值虽然成功但页面数据不会修改
// prevPage.data.$root.title = 'Hello World'
prevPage.setData({
title: 'Hello World'
})
uni.navigateBack()
},
//A页面，onShow方法，把setData的数据赋值到当前页面绑定的变量上
onShow(e) {
let pages = getCurrentPages();
let currPage = pages;
if(currPage.data.title == undefined || currPage.data.title == ''){
}else{
this.title = currPage.data.title
}
},
</code></pre>
<h3 id="方案二on监听">方案二：$on监听</h3>
<p>https://uniapp.dcloud.io/api/window/communication</p>
<pre><code class="language-js">//A页面, onShow中添加监听一个handleFun的事件
onShow(){
uni.$on("handleFun", res => {
this.title = res.title；
// 清除监听
uni.$off('handleFun');
})
},
//B页面， 返回A页面触发一个事件，使用uni.$emit("handleFun",{})
getAddress(){
uni.$emit("handleFun",{title: 'Hello World'});
uni.navigateBack()
}
</code></pre>
<h3 id="方案三缓存值的方式">方案三：缓存值的方式</h3><br><br>
来源：https://www.cnblogs.com/vicky123/p/12856011.html
頁:
[1]