小程序监听globalData值改变

通过使用 eventBus 来监听

eventBus.js

javascript 复制代码
import Vue from 'vue';
export const EventBus = new Vue();

app.vue

xml 复制代码
<script>
	import {
		EventBus
	} from './utils/eventBus.js';
	export default {
	globalData: {
	   spid: 0
	},
	methods: {

	},
	onLoad() {
	    console.log('onoad')
	},
	onLaunch: function() {
	let that = this;
	setInterval(() => {
	     that.globalData.spid++;
	     EventBus.$emit('spidChanged', that.globalData.spid); // Emit event
	   }, 1000);
	},
	onShow: function() {
	  console.log('App Show')
	},
	onHide: function() {
	   console.log('App Hide')
	}
}
</script>

<style>
	/*每个页面公共css */
</style>

其他页面使用

xml 复制代码
<template>
  <div>
    <p>Current spid: {{ spid }}</p>
  </div>
</template>

<script>
import { EventBus } from './eventBus';

export default {
  data() {
    return {
      spid: 0
    };
  },
  created() {
    EventBus.$on('spidChanged', (newSpid) => {
      this.spid = newSpid;
    });
  },
  beforeDestroy() {
    EventBus.$off('spidChanged'); // Clean up the listener
  }
}
</script>
相关推荐
huwuhang13 小时前
跨平台电子书阅读器 | Readest最新版 安卓版+PC版全平台
android·前端·javascript
C澒13 小时前
AI 生码:RAG 检索优化实现可评估、可回溯工程化
前端·ai编程
条tiao条13 小时前
不止语法糖:TypeScript Set 与 Map 深度解析
前端·javascript·typescript
freewlt13 小时前
React Server Components 深度解析:从原理到实战的完整指南
前端·javascript·react.js
ZC跨境爬虫14 小时前
Playwright进阶操作:鼠标拖拽与各类点击实战(含自定义拖拽实例)
前端·爬虫·python·ui
小江的记录本14 小时前
【RabbitMQ】RabbitMQ核心知识体系全解(5大核心模块:Exchange类型、消息确认机制、死信队列、延迟队列、镜像队列)
java·前端·分布式·后端·spring·rabbitmq·mvc
心静财富之门14 小时前
《前端零基础入门:HTML + CSS + JavaScript 全套速查表(详细版 + 实例)》
前端·javascript·python
星空14 小时前
前端--A_4--HTML表单
前端
We་ct14 小时前
JS手撕:DOM操作 & 浏览器API高频场景详解
开发语言·前端·javascript·面试·状态模式·操作·考点
小江的记录本14 小时前
【RocketMQ】RocketMQ核心知识体系全解(5大核心模块:架构模型、事务消息两阶段提交、回查机制、延迟消息、顺序消息)
linux·运维·服务器·前端·后端·架构·rocketmq