mui 记录

nui-app 带参数返回上一页

2019-08-26  本文已影响0人  bianruifeng

在uni-app开发中使用uni.navigateBack后想将数据传到上个页面

应用场景:A页跳转到B页,B页返回A页,并将参数带回给A页面。

微信中使用setData可以做到:

var pages = getCurrentPages();
var currPage = pages[pages.length - 1]; //当前页面
var prevPage = pages[pages.length - 2]; //上一个页面
//直接调用上一个页面的setData()方法,把数据存到上一个页面中去
prevPage.setData({
    hope_job: "test"
})
uni.navigateBack();

在uni-app开发中是无效的,解决办法如下:

1.在main.js文件中加入

Vue.prototype.$eventHub = new Vue();

2.在监听页面加入

this.$eventHub.$on('fire', function (data) {
    console.log('fire - '+data);
});

3.在发送页面加入

this.$eventHub.$emit('fire','data');

4.记得取消监听,会消耗性能

this.$eventHub.$off('fire');

A页面:

onLoad() {
    this.loadData();
    this.$fire.$on('fire', function(item) {
        console.log("item: " + JSON.stringify(item));
    })
},
onUnload() {
    this.$fire.$off('fire');
},

B 页面:

selectItem: function(e) {
    console.log("e: " + JSON.stringify(e));
    var item = this.list[e]
    this.$fire.$emit('fire',item);
    uni.navigateBack()
}

关于onLoad、onUnload......
查看官网nui-app 生命周期

其他方法

上一篇下一篇

猜你喜欢

热点阅读