perf: 优化应用

This commit is contained in:
kuaifan 2025-07-15 17:29:09 +08:00
parent db282d1a04
commit c906636776

View File

@ -1,19 +1,37 @@
<template> <template>
<iframe <div class="micro-app-iframe">
ref="iframe" <iframe
class="micro-app-iframe" ref="iframe"
:src="src" class="micro-app-iframe-container"
sandbox="allow-scripts allow-forms allow-same-origin allow-popups allow-popups-to-escape-sandbox"> :src="src"
</iframe> sandbox="allow-scripts allow-forms allow-same-origin allow-popups allow-popups-to-escape-sandbox">
</iframe>
<div v-if="isLoading" class="micro-app-iframe-cover"></div>
</div>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.micro-app-iframe { .micro-app-iframe {
border: none; position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
padding-top: var(--status-bar-height);
padding-bottom: var(--navigation-bar-height); .micro-app-iframe-container {
border: none;
width: 100%;
height: 100%;
padding-top: var(--status-bar-height);
padding-bottom: var(--navigation-bar-height);
}
.micro-app-iframe-cover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;
}
} }
</style> </style>
<script> <script>
@ -37,6 +55,7 @@ export default {
data() { data() {
return { return {
src: this.url, src: this.url,
isLoading: true,
onBeforeClose: {}, onBeforeClose: {},
} }
}, },
@ -57,11 +76,10 @@ export default {
methods: { methods: {
// iframe // iframe
handleLoad(e) { handleLoad() {
this.injectMicroApp() this.injectMicroApp()
this.$emit('mounted', { this.$emit('mounted', {
...e,
detail: { detail: {
name: this.name, name: this.name,
} }
@ -71,7 +89,6 @@ export default {
// iframe // iframe
handleError(e) { handleError(e) {
this.$emit('error', { this.$emit('error', {
...e,
detail: { detail: {
name: this.name, name: this.name,
error: e, error: e,
@ -87,7 +104,8 @@ export default {
const {type, message} = e.data; const {type, message} = e.data;
switch (type) { switch (type) {
case 'MICRO_APP_READY': case 'MICRO_APP_READY':
this.injectMicroApp() this.handleLoad()
this.isLoading = false
this.$store.commit('microApps/update', { this.$store.commit('microApps/update', {
name: this.name, name: this.name,
data: { data: {