uniapp中url传参有长度限制，太长的字符串会传递失败，可使用evenchannel，也可使用事件总线传参

一.eventChannel传参，可正向传参也可逆向传参

首页向详情页传递数据在success方法中使用emit传递，详情页使用on接收

详情页向首页传递数据在详情页中使用emit传递，首页使用Event定义函数

<template>
    <view class="content">
        <button @click="toDetail">去往详情页</button>
    </view>
</template>

<script>
    export default {
        data() {
            return {
              
        },
        onLoad() {
           
        },
        methods: {
            toDetail(){
                uni.navigateTo({
                    url:'/pages/indexDetail/indexDetail',
                    // events定义的是详情页传过来的数据的方法
                    events:{
                        fromIndex1(res){
                            console.log('fromIndex1返回过来的数据',res)
                        },
                        fromIndex2(res){
                            console.log('fromIndex2返回过来的数据',res)
                        }
                    },
                    success(res) {
                        // 使用emit向详情页传递数据
                        res.eventChannel.emit('todetailData','从首页传递过来的数据11')
                    }
                    
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
    @import '@/static/css/base.scss';
    .content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .logo {
        height: 200rpx;
        width: 200rpx;
        margin-top: 200rpx;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 50rpx;
    }

    .text-area {
        display: flex;
        justify-content: center;
    }
    .name{
        color: $color-green;
    }
    .iconFz{
        font-size: 40rpx;
        color: red;
    }
    // 修改组件的样式
    // vue有 :deep(组件类名修改样式)

</style>
 

详情页接受数据和向首页返回数据

<template>
    <view>
        <button @click="goback()">返回上一页</button>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                evenchannel:null,
            }
        },
        onLoad() {
            this.getOpenerEventChannel()
            this.evenchannel=this.getOpenerEventChannel()
             // 监听todetailData事件，获取上一页面通过eventChannel传送到当前页面的数据
            this.evenchannel.on('todetailData',function(data){
                console.log(data)
            })
        },
        methods: {
            goback(){
                uni.navigateBack({
                    delta:1
                })
                // 在test.vue页面，向起始页通过事件传递数据
                this.evenchannel.emit('fromIndex1',{
                    name:'andy',
                    age:18
                })
                this.evenchannel.emit('fromIndex2',{
                    name:'bob',
                    age:20
                })
            }
        }
    }
</script>

<style>

</style>
 

二.事件总线传参，可从下一页往上一页传参（只能逆向，先监听后触发）

methods: {
            goback(){
                uni.navigateBack({
                    delta:1
                })
                // 事件总线逆向传递数据,在返回页面的onload事件接收
                uni.$emit('emitBusEvent',{data:'事件总线逆向传递数据,在返回页面的onload事件接收'})
            }
        }

在上一页的onload事件接收，onUnload移除监听谨防内存泄漏

onLoad() {
            uni.$on('emitBusEvent',this.emitBusAct)
        },
        onUnload() {
            // 移除全局事件总线监听
            uni.$off('emitBusEvent',this.emitBusAct)
            
        },
        methods: {
            emitBusAct(data){
                console.log('data',data)
            },
        }