admin管理员组

文章数量:1352803

I am using single spa for my current project and want to have a loader till my micro app gets loaded and there will be a switch between these micro apps , in that case also I want to show a loader. Is there any way to achieve the same?

I am using single spa for my current project and want to have a loader till my micro app gets loaded and there will be a switch between these micro apps , in that case also I want to show a loader. Is there any way to achieve the same?

  • javascript
  • micro-frontend
  • single-spa-angular
  • single-spa
Share Improve this question asked Apr 28, 2020 at 3:03 ranjeet kumarranjeet kumar 2713 silver badges10 bronze badges 0
Add a ment  | 

1 Answer 1

Reset to default 12

Option 1 - single-spa-layout

See https://single-spa.js/docs/layout-definition#loading-uis

Option 2 - Implement it in your loading function

import { registerApplication } from 'single-spa';

registerApplication({
  name: "app1",
  app: loadApp1,
  activeWhen: '/'
})

function loadApp1() {
  return Promise.resolve().then(() => {
    placeLoader()
    return System.import('app1')
  }).then(app => {
    removeLoader()
    return app;
  })
}

function placeLoader() {
  document.body.appendChild(
    Object.assign(document.createElement('img'), {
      id: 'single-spa-loader',
      src: "loading.gif"
    })
  })
}

function removeLoader() {
  document.getElementById('single-spa-loader').remove()
}

本文标签：

版权声明：本文标题：javascript - Is there any way to show a loader till micro apps getting loaded in single spa project - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1743919639a2561848.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。