vue3中返回带参数如何实现?
1 利用$vm对象。直接获取上一个页面对象的实例,直接操控该页面中的数据进行更改。
const selectItem = async (data, type) => {console.log('data-----', data)curSelectedData.value = dataconsole.log('当前选择项', curSelectedData.value)//上一个页面的信息const pages = getCurrentPages()const prevPage = pages[pages.length - 2]console.log('pages---', pages)console.log('pages---', prevPage)if (prevPage && prevPage.$vm) {console.log('prevPage.$vm', prevPage.$vm)console.log('prevPage.$vm', prevPage.$vm.detailData.value)let { taskId, itemCode } = curSelectedData.valueprevPage.$vm.detailData.itemCode = prevPage.$vm.getDetail(taskId)}router.back()
这里有两个注意的点:
1如果想在B页面返回时操作A页面中的数据。A页面中定义的数据(可以是ref对象或者函数)必须要通过defineExpose()出去。否则prevPage.$vm拿不到。因为vue3默认内部都是私有的
2 如果是A页面中定义的对象是通过ref()定义的,在B页面修改时无需.value;内部会自动解析
prevPage.$vm.detailData.itemCode = prevPage.$vm.getDetail(taskId)