uniapp全局监听，页面修改页面 uni.$emit(),uni.on(),uni.off()

文章2023-02-0199 人已阅来源：网络

页面A

<template>
    <view>
        <text>我是任一页面</text>
        <button type="warn" @click="globleEvent">全局事件订阅</button>
    </view>
</template>
 
<script>
    export default {
        methods:{
            globleEvent(){
                //全局事件订阅只要注册的页面都可以收到回调值
                uni.$emit("globleEvent","我是全局事件订阅的调用方法")
            }           
        }
    }
</script>

页面B

<template>
    <view>
       <view>{{title}}</view>
      <view>{{content}}</view>
    </view>
</template>
 
<script>
    export default {
        data() {
            return {
                title:'任二页面初始状态',
                content:"此页面初始内容"
            };
        },
        onLoad() {
         //结束上一次监听
         uni.$off();
            //全局事件订阅，只要订阅了事件就可以收到值
            uni.$on("globleEvent",async (res)=>{
             console.log(res);//我是全局事件订阅的调用方法
             tihs.content = res;
               this.update()
            })
        },
        methods:{
            async update(res){
              //此时可以进行你的主页面的操作，调用某个方法等等
                this.title="被任一页面修改后的"
            }
        }
    }
</script>

相关内容

  • HBuilderX uniapp项目运行到小程序一直正在编译的问题

    今天使用uniapp运行到小程序时，没有反应，一直卡在开始编译的步骤09:46:21.564项目'uniapp'开始编译...解决方法：条件编译得放上面！！！！...

    HBuilderX uniapp项目运行到小程序一直正在编译的问题
  • uniapp & vue 父子、子父、兄弟组件之间的传值

    以下组件传值适用于uniapp和vue。具体代码如下所示：一、父子组件传值父传子的关键：父组件在标签上传递，子组件通过props接收。1.父组件中（传递）//1引入子组件imp...

  • css中margin的4个属性顺序

    在CSS中，margin 属性的四个值可以按照以下两种方式来指定：按照顺时针方向依次指定上、右、下、左四个方向的外边距值。例如：margin:10px20px15px5px;/...

  • css中padding四个值的顺序

    当你使用padding属性来设置元素的内边距时，可以按照以下两种方式来指定四个值：按照顺时针方向依次指定上、右、下、左四个方向的内边距值。例如：padding:10px20px...

  • 微信手机弹幕/手持弹幕怎么弄

    有很多朋友问：手机弹幕怎么弄？在这里给大家分享一下，手机弹幕一般是小程序制作的，不用麻烦的再去下载APP。在这里给大家说一下，手机弹幕和手持弹幕其实是说的一个东西，只是叫法不同...

    微信手机弹幕/手持弹幕怎么弄
  • JS中函数(function)的定义以及几种用法

    在JavaScript中，函数（function）是一种可重复使用的代码块，用于执行特定的任务。函数可以接受参数（也称为形式参数），执行一系列的操作，并返回一个值。以下是定义函...

  • js中function函数的用法

    ...

  • js find()方法的用法与详解

    find() 方法是JavaScript数组对象的一个方法，用于查找数组中满足指定条件的第一个元素，并返回该元素。find() 方法的语法如下：array.find(funct...

  • js中split()方法的用法与详解

    split() 方法是JavaScript字符串对象的一个方法，用于将字符串拆分成一个字符串数组，基于指定的分隔符将字符串分割成多个子字符串。split() 方法的语法如下：s...

  • CSS linear-gradient() 函数 详解

    linear-gradient() 函数是CSS中用于创建线性渐变背景的函数。它可以在两个或多个颜色之间创建平滑过渡的效果。linear-gradient() 函数的语法如下：...

浏览更多有关 的内容