uni-app页面通讯之返回页面时传递参数_HBuilderX教程

导读：一般来说，在uni-app中，使用uni.$emit、$uni.on、$uni.once、$uni.off进行页面通讯。

页面通讯
现在设置一下场景。从page1跳转到page2；从page2点击确认，返回上一个页面，并传递参数。

页面1接收参数，代码如下：

<template>

    <view style="background-color: #FFFFFF;height: 100vh;">

        <navigator class="text-blue" url="page2">到页面2</navigator>

    </view>

</template>

<script>

    export default {

        data() {

            return {

            }

        },

        onShow: function() {

            uni.$once('query' ,(query)=>{

                console.log("返回的参数=>" , query);

            });

        },

        methods: {

        }

    }

</script>

<style>

</style>

页面2传递参数，代码如下：

<template>

    <view>

        <button @click="reBack">返回</button>

    </view>

</template>

<script>

    export default {

        data() {

            return {

            }

        },

        methods: {

            // 返回上一个页面，并传递参数

            reBack : function(){

                uni.$emit('query' , {a : 1});

                uni.navigateBack();

            }

        }

    }

</script>

<style>

</style>

点击“返回”按钮，页面1，返回的值为：返回的参数=> {a: 1}

全站搜索

uni-app页面通讯之返回页面时传递参数

最新推荐

本周排行