From 6afa80f05bf3f001070fd8a2510ac7cde0d1d15d Mon Sep 17 00:00:00 2001 From: litian <2804272236@qq.com> Date: 星期三, 24 四月 2024 16:26:14 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/TextbookReader --- src/assets/main.css | 2 index.html | 2 src/child.ts | 69 ++++++++++++++++++---------------- src/router/index.ts | 6 +- src/views/home.vue | 24 +++++++++-- src/main.ts | 2 6 files changed, 61 insertions(+), 44 deletions(-) diff --git a/index.html b/index.html index c538241..a9a6a0f 100644 --- a/index.html +++ b/index.html @@ -8,7 +8,7 @@ <title>鏁板瓧鏁欐潗闃呰鍣�</title> </head> <body> - <div id="app"></div> + <div id="parentApp"></div> <script type="module" src="/src/main.ts"></script> </body> </html> diff --git a/src/assets/main.css b/src/assets/main.css index f0291dd..fcfa5fb 100644 --- a/src/assets/main.css +++ b/src/assets/main.css @@ -1,6 +1,6 @@ @import './base.css'; -#app { +#parentApp { width: 100%; height: 100%; } diff --git a/src/child.ts b/src/child.ts index b605519..829a065 100644 --- a/src/child.ts +++ b/src/child.ts @@ -1,47 +1,50 @@ -import { registerMicroApps,setDefaultMountApp} from "qiankun"; +import { registerMicroApps, setDefaultMountApp, start } from 'qiankun' const microApps = [ { // - 蹇呴�夛紝寰簲鐢ㄧ殑鍚嶇О锛屽井搴旂敤涔嬮棿蹇呴』纭繚鍞竴 - name: "vue-app", + name: 'app-content', // - 蹇呴�夛紝寰簲鐢ㄧ殑鍏ュ彛 - entry: 'http://192.168.3.196:8080/', + entry: '//182.92.203.7:3007/books/test/', + // entry: '//192.168.3.196:8080/', // - 蹇呴�夛紝寰簲鐢ㄧ殑瀹瑰櫒鑺傜偣鐨勯�夋嫨鍣ㄦ垨鑰� Element 瀹炰緥 - container: "#container", + container: '#container', // - 蹇呴�夛紝寰簲鐢ㄧ殑婵�娲昏鍒� //鏀寔鐩存帴閰嶇疆瀛楃涓叉垨瀛楃涓叉暟缁勶紝濡� activeRule: '/app1' 鎴� activeRule: ['/app1', '/app2']锛屽綋閰嶇疆涓哄瓧绗︿覆鏃朵細鐩存帴璺� url 涓殑璺緞閮ㄥ垎鍋氬墠缂�鍖归厤锛屽尮閰嶆垚鍔熻〃鏄庡綋鍓嶅簲鐢ㄤ細琚縺娲汇�� //鏀寔閰嶇疆涓�涓� active function 鍑芥暟鎴栦竴缁� active function銆傚嚱鏁颁細浼犲叆褰撳墠 location 浣滀负鍙傛暟锛屽嚱鏁拌繑鍥� true 鏃惰〃鏄庡綋鍓嶅井搴旂敤浼氳婵�娲汇�傚 location => location.pathname.startsWith('/app1')銆� - activeRule: "#/app-content", //鍖归厤鎵�鏈変互/subPath寮�澶寸殑涓哄瓙搴旂敤 + activeRule: '/home' //鍖归厤鎵�鏈変互/subPath寮�澶寸殑涓哄瓙搴旂敤 //loader - (loading: boolean) => void - 鍙�夛紝loading 鐘舵�佸彂鐢熷彉鍖栨椂浼氳皟鐢ㄧ殑鏂规硶銆� //鍙�夛紝涓诲簲鐢ㄩ渶瑕佷紶閫掔粰寰簲鐢ㄧ殑鏁版嵁銆� - props: { - _parent_base: '/app-content/', - msg:'杩欐槸涓诲簲鐢ㄤ紶缁欏瓙搴旂敤鐨勬秷鎭�' - }, - }, -]; -// 涔惧潳鎻愪緵鐨勫瓙搴旂敤鐢熷懡鍛ㄦ湡閽╁瓙 鍙敤浜庡姞杞絣oading -const mount={ - beforeLoad: () => { - //寮�濮嬪姞杞絣oading - console.log('瀛愬簲鐢ㄥ姞杞藉墠') - }, - beforeMount: () => { - console.log('瀛愬簲鐢ㄦ寕杞藉墠') - }, - afterMount: () => { - //缁撴潫鍔犺浇loading - console.log('瀛愬簲鐢ㄦ寕杞藉悗') - }, - beforeUnmount: () => { - console.log('瀛愬簲鐢ㄥ嵏杞藉墠') - }, - afterUnmount: () => { - console.log('瀛愬簲鐢ㄥ嵏杞藉悗') - }, + // props: { + // _parent_base: '/app-content/', + // msg:'杩欐槸涓诲簲鐢ㄤ紶缁欏瓙搴旂敤鐨勬秷鎭�' + // }, } +] +// 涔惧潳鎻愪緵鐨勫瓙搴旂敤鐢熷懡鍛ㄦ湡閽╁瓙 鍙敤浜庡姞杞絣oading +const mount = { + beforeLoad: () => { + //寮�濮嬪姞杞絣oading + console.log('瀛愬簲鐢ㄥ姞杞藉墠') + }, + beforeMount: () => { + console.log('瀛愬簲鐢ㄦ寕杞藉墠') + }, + afterMount: () => { + //缁撴潫鍔犺浇loading + console.log('瀛愬簲鐢ㄦ寕杞藉悗') + }, + beforeUnmount: () => { + console.log('瀛愬簲鐢ㄥ嵏杞藉墠') + }, + afterUnmount: () => { + console.log('瀛愬簲鐢ㄥ嵏杞藉悗') + } +} //娉ㄥ唽瀛愬簲鐢� -registerMicroApps(microApps,mount); +registerMicroApps(microApps, mount) //璁剧疆榛樿鍚姩瀛愬簲鐢� -setDefaultMountApp('/subPath'); +setDefaultMountApp('/home') //鍚姩qiankun | 涓嶅彲閲嶅鍚姩 | 濡傛灉瀛愬簲鐢ㄥ叆鍙e湪app.vue閲屽彲浠ュ湪杩欏惎鍔ㄥ惁鍒欎細鎶ラ敊鎵句笉鍒板瓙搴旂敤缁撶偣 -//start() +start({ + prefetch: false, +}) diff --git a/src/main.ts b/src/main.ts index 95c79c2..1c4f4c5 100644 --- a/src/main.ts +++ b/src/main.ts @@ -48,4 +48,4 @@ app.component(key, component) } -app.mount('#app') +app.mount('#parentApp') diff --git a/src/router/index.ts b/src/router/index.ts index af82e54..7088b74 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -1,10 +1,10 @@ -import { createRouter, createWebHashHistory } from 'vue-router' +import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router' import Layout from '@/layout/layout.vue' const Home = () => import('@/views/home.vue') const Login = () => import('@/views/login.vue') const router = createRouter({ - history: createWebHashHistory(import.meta.env.BASE_URL), + history: createWebHistory(import.meta.env.BASE_URL), routes: [ { path: '/', @@ -23,7 +23,7 @@ path: '/home', name: 'home', meta: { auth: true }, - component: Home + component: Home, } ] } diff --git a/src/views/home.vue b/src/views/home.vue index 3056d37..d50278e 100644 --- a/src/views/home.vue +++ b/src/views/home.vue @@ -120,7 +120,7 @@ <div><img :src="zoomOut" @click="changePageSize('reduce')" /></div> </div> <div class="brushImgBox"> - <div><img :src="huabi2" class="brushImg" />鐢荤瑪</div> + <div @click="loadChild"><img :src="huabi2" class="brushImg" />鐢荤瑪</div> <!-- <el-switch v-model="headerData.brushToolShow" @change="brushToolShow"/> --> </div> </div> @@ -443,6 +443,13 @@ <script setup lang="ts"> import { ref, reactive, watch, onMounted } from 'vue' +import { useRouter, useRoute } from 'vue-router' + +//鑾峰彇璺敱鍣� +let $router = useRouter() +//鑾峰彇褰撳墠璺敱鐨勪俊鎭� +let $route = useRoute() + import { ElMessage } from 'element-plus' import mulu from '@/assets/images/menu/mulu.png' import biji from '@/assets/images/menu/biji.png' @@ -513,10 +520,8 @@ import zoomIn from '../assets/images/operation/zoomIn.png' import zoomOut from '../assets/images/operation/zoomOut.png' import huabi2 from '../assets/images/operation/huabi.svg' -import { start } from 'qiankun' -onMounted(() => { - start() -}) +import { loadMicroApp } from 'qiankun' + // 鑿滃崟 const menuData = reactive([ { @@ -1075,6 +1080,15 @@ ctx = canvas.value.getContext('2d') as CanvasRenderingContext2D } } + +const loadChild = () => { + // loadMicroApp({ + // name: 'book', + // entry: '//192.168.3.196:8080/', + // container: document.querySelector('#container') + // }) + // $router.push({path: "/aa"}) +} </script> <style lang="less"> -- Gitblit v1.9.1