FIX iframe标签切换后刷新

src/layout/components/iframeView.vue

@@ -0,0 +1,66 @@
+<!--
+ * @Descripttion: 处理iframe持久化，涉及store(VUEX)
+ * @version: 1.0
+ * @Author: sakuya
+ * @Date: 2021年6月30日13:20:41
+ * @LastEditors:
+ * @LastEditTime:
+-->
+
+<template>
+	<div v-show="$route.meta.type=='iframe'" class="iframe-pages">
+		<iframe v-for="item in iframeList" :key="item.meta.url" v-show="$route.meta.url==item.meta.url" :src="item.meta.url" frameborder='0'></iframe>
+	</div>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		watch: {
+			$route(e) {
+				this.push(e)
+			},
+		},
+		created() {
+			this.push(this.$route);
+		},
+		computed:{
+			iframeList(){
+				return this.$store.state.iframe.iframeList
+			},
+			ismobile(){
+				return this.$store.state.global.ismobile
+			},
+			layoutTags(){
+				return this.$store.state.global.layoutTags
+			}
+		},
+		mounted() {
+
+		},
+		methods: {
+			push(route){
+				if(route.meta.type == 'iframe'){
+					if(this.ismobile || !this.layoutTags){
+						this.$store.commit("setIframeList", route)
+					}else{
+						this.$store.commit("pushIframeList", route)
+					}
+				}else{
+					if(this.ismobile || !this.layoutTags){
+						this.$store.commit("clearIframeList")
+					}
+				}
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.iframe-pages {width:100%;height:100%;background: #fff;}
+	iframe {border:0;width:100%;height:100%;display: block;}
+</style>

src/layout/components/tags.vue

@@ -119,6 +119,7 @@
 			//关闭tag
 			closeSelectedTag(tag) {
 				this.$store.commit("removeViewTags", tag)
+				this.$store.commit("removeIframeList", tag)
 				this.$store.commit("removeKeepLive", tag.name)
 				if (this.isActive(tag)) {
 					const latestView = this.tagList.slice(-1)[0]
@@ -151,6 +152,7 @@
 						path: nowTag.path
 					})
 				}
+				this.$store.commit("refreshIframe", nowTag)
 				var _this = this;
 				setTimeout(function() {
 					_this.$store.commit("removeKeepLive", nowTag.name)

src/layout/index.vue

@@ -35,6 +35,7 @@
 				<Tags v-if="!ismobile && layoutTags"></Tags>
 				<div class="adminui-main" id="adminui-main">
 					<router-view></router-view>
+					<iframe-view></iframe-view>
 				</div>
 			</div>
 		</section>
@@ -72,6 +73,7 @@
 				<Tags v-if="!ismobile && layoutTags"></Tags>
 				<div class="adminui-main" id="adminui-main">
 					<router-view></router-view>
+					<iframe-view></iframe-view>
 				</div>
 			</div>
 		</section>
@@ -91,6 +93,7 @@
 	import NavMenu from './components/NavMenu.vue';
 	import userbar from './components/userbar.vue';
 	import setting from './components/setting.vue';
+	import iframeView from './components/iframeView.vue';
 
 	export default {
 		name: 'index',
@@ -100,7 +103,8 @@
 			Tags,
 			NavMenu,
 			userbar,
-			setting
+			setting,
+			iframeView
 		},
 		data() {
 			return {

src/router/index.js

@@ -82,7 +82,6 @@ function filterAsyncRouter(routerMap) {
 		if(item.meta.type=='iframe'){
 			item.meta.url = item.path;
 			item.path = `/i/${item.name}`;
-			item.component = 'other/iframe';
 		}
 		//MAP转路由对象
 		var route = {

src/store/modules/iframe.js

@@ -0,0 +1,38 @@
+export default {
+	state: {
+		iframeList: []
+	},
+	mutations: {
+		setIframeList(state, route){
+			state.iframeList = []
+			state.iframeList.push(route)
+		},
+		pushIframeList(state, route){
+			let target = state.iframeList.find((item) => item.path === route.path)
+			if(!target){
+				state.iframeList.push(route)
+			}
+		},
+		removeIframeList(state, route){
+			state.iframeList.forEach((item, index) => {
+				if (item.path === route.path){
+					state.iframeList.splice(index, 1)
+				}
+			})
+		},
+		refreshIframe(state, route){
+			state.iframeList.forEach((item) => {
+				if (item.path == route.path){
+					var url = route.meta.url;
+					item.meta.url = '';
+					setTimeout(function() {
+						item.meta.url = url
+					}, 200);
+				}
+			})
+		},
+		clearIframeList(state){
+			state.iframeList = []
+		}
+	}
+}