小程序监听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>
相关推荐
IT_陈寒24 分钟前
React 性能优化:5个实战技巧让首屏加载提升50%,开发者亲测有效!
前端·人工智能·后端
rising start41 分钟前
前端基础一、HTML5
前端·html·html5
鬼谷中妖1 小时前
JavaScript 循环与对象:深入理解 for、for...in、for...of、不可枚举属性与可迭代对象
前端
大厂码农老A1 小时前
你打的日志,正在拖垮你的系统:从P4小白到P7专家都是怎么打日志的?
java·前端·后端
im_AMBER1 小时前
CSS 01【基础语法学习】
前端·css·笔记·学习
DokiDoki之父1 小时前
前端速通—CSS篇
前端·css
pixle01 小时前
Web大屏适配终极方案:vw/vh + flex + clamp() 完美组合
前端·大屏适配·vw/vh·clamp·终极方案·web大屏
ssf19871 小时前
前后端分离项目前端页面开发远程调试代理解决跨域问题方法
前端
@PHARAOH1 小时前
WHAT - 前端性能指标(加载性能指标)
前端
尘世中一位迷途小书童1 小时前
🎨 SCSS 高级用法完全指南:从入门到精通
前端·css·开源