Bootstrap

qiankun微任务之全局状态管理

上篇文章我们介绍了如何在本地搭建一个简单的乾坤前端微服务,如果我们想要在主项目、子项目之间或者子项目之间传递一个公共数据,如何处理哪?

全局状态管理

  一般来说,各个子应用是通过业务来划分的,不同业务线应该降低耦合度,尽量去避免通信,但是如果涉及到一个公共的状态或者操作,qiankun也是支持的。
  qiankun提供了一个全局的GlobalState来共享数据,基座初始化之后,子应用可以监听到这个数据的变化,也能修改这个数据。

基座

import { initGlobalState } from 'qiankun';
const state = {count: 1} //测试用例
const actions = initGlobalState(state);
// 主项目监听
actions.onGlobalStateChange((state, prev) => {
//state:变更后的状态  prev:变更前的状态
	console.log(state, prev)
})
//修改
actions.setGlobalState(state)

子应用

export function mount(props){
	props.onGlobalStateChange((state, prev) => {
	//state:变更后的状态  prev:变更前的状态
		console.log(state, prev)
	})
	//修改
	props.setGlobalState({count: 2})
}
;