uniapp 跨页面传值及跨页面方法调用

niceguyº2023-11-17 22:06

uniapp 跨页面传值及跨页面方法调用

1、跨页面传值

使用全局方法监听uni.$emit、uni.$on、uni.$off 发布、监听、移除

js 复制代码

methods: {
	addFun(){
		let data = [1]
		uni.navigateBack({ // 返回上一页
          delta: 1
        })
		uni.$emit('successFun',{data}) // 传值
	}
}

监听页

js 复制代码

onLoad() {
    uni.$on('successFun', (e => {
        // ...do something
    }))
},
onUnload() {
    // 移除监听
    uni.$off('successFun');
},

2、跨页面方法调用

场景：当前页面数据提交后需要更新上一页的表单，调用当前页的上一页的某个方法

js 复制代码

methods: {
	addFun(){
		let pages = getCurrentPages() // 获取当前页面栈的实例，以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面。
        let prevPage = pages[pages.length - 2] //上一页页面实例
		let data = [1]
		uni.navigateBack({ // 返回上一页
          delta: 1,
          success: () => {
        	prevPage.$vm.fartherFun(data) // 调用上一页的方法,传参
		  }
        })
	}
}