angular微前端主应用和子应用传值

最新推荐文章于 2024-05-30 15:07:12 发布

Re06

最新推荐文章于 2024-05-30 15:07:12 发布

阅读量172

点赞数

文章标签：前端 angular.js javascript

本文链接：https://blog.csdn.net/m0_72978470/article/details/128932988

版权

一、主应用

在主应用加粗样式的组件内或者main.ts中

import { initGlobalState } from 'qiankun';

const { setGlobalState, } = initGlobalState({});

setGlobalState({
      userName: '张三',
      age: 10,
    });

二、子应用

在子应用的任意组件中

import { singleSpaPropsSubject } from '../single-spa/single-spa-props';

ngOnInit() {
    singleSpaPropsSubject.subscribe(props=>{
      // @ts-ignore
      props.onGlobalStateChange(state=>{
        console.log('state',state)
      },true)
    })
  }
  //写true是立即监听，如果不写true，就拿不到首次传过来的值