1、正向传值:
a.vue 跳转到b.vue 页面,a向b传值,可通过跳转时url带参数的形式;如下:
uni.navigateTo({
url: 'b?name=uniapp'
});
b页面在onLoad中通过option来获取传递过来的参数
onLoad(option) {
this.name=option.name
},
2、返回传值-方法1:通过getCurrentPages()实现
b.vue返回到a.vue 页面,把name值“helloworld”传给a页面:
- b页面中设置上一页面的值
var pages = getCurrentPages();
var prevPage = pages[pages.length - 2]; //上一个页面
prevPage.name= 'helloworld';
uni.navigateBack();
- a页面在onshow中重置name的值
onShow: function() {
let pages = getCurrentPages();
let currPage = pages[pages.length - 1];
this.name= currPage.name;
},
3、返回传值-方法2:通过监听全局方法实现
b.vue返回到a.vue 页面,把选择的code值“20201212”传给a页面:
3.1在a.vue页面中,点击“选择资产编码”时,跳转到选择编码页面
<script>
let hasSCodeFun = false; //是否绑定选择编码
...
data() {
return {
...
objForm: {
type: '', //类型
subtype: '', //子类
code:''
},
}
},
onLoad: function(options) {
hasSCodeFun=false;//修改全局是否注册时间的标志
...
},
onUnload() {
//一定要销毁监听事件
uni.$off('selectCode') //在此生命周期里销毁地址改变事件的监听
},
methods:{
...
// 跳转到选择编码页面
jumpToGetCode(codetype){
// 注意:不要重复监听
if(!hasSCodeFun){
uni.$on('selectCode', (info) => { //开启监听全局的选择编码事件,显示传递的值
let item=info.data[0];
hasSCodeFun = true
this.$set(this.objForm,'code',item.code)
})
}
// 向新页面中传参
let params={
codetype:codetype,
type:this.objForm.type,
subtype:this.objForm.subtype
}
uni.navigateTo({
url:'../selectcode/selectcode?params='+JSON.stringify(params)
})
},
}
3.2 在b.vue页面中暴露全局方法selectCode
// 确定选择
doSure(arrChoose){
// 把值通过全局方法暴露出去
uni.$emit('selectCode',{data:arrChoose});
this.doCancel()
},
// 返回
doCancel(){
uni.navigateBack({
delta: 1
});
}
4、适用场景:
如,当前a页面有个下拉列表>,点击之后跳转到b页面,选择之后,a页面显示下拉列表值