archive/qiu-mo-jetbrains-help
1
0
Fork 0
mirror of https://gitee.com/guoyifanA/qiu-mo-jetbrains-help.git synced 2026-09-21 22:30:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

实现一个简单的路由

Browse Source
This commit is contained in:
M0914
2025-09-24 13:47:24 +08:00
parent 5620df010c
commit f2fb339e30
3 changed files with 44 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/static/index.html
+7
View File
@@ -20,6 +20,13 @@
<!-- 自定义样式 --> <!-- 自定义样式 -->
<link rel="stylesheet" href="/css/main.css" /> <link rel="stylesheet" href="/css/main.css" />
<link rel="stylesheet" href="/css/sponsor.css" /> <link rel="stylesheet" href="/css/sponsor.css" />
<!-- 设置默认路由 -->
<script>
if (!window.location.hash) {
window.location.hash = 'home';
}
</script>
</head> </head>
<body class="bg-gray-50"> <body class="bg-gray-50">
<div id="app"> <div id="app">
src/main/resources/static/js/app.js
+18 -3
View File
@@ -5,7 +5,7 @@ const { createApp } = Vue
const App = { const App = {
data() { data() {
return { return {
currentPage: 'home', currentPage: Utils.getCurrentPage(), // 从URL获取当前页面
showConfigModal: false, showConfigModal: false,
showLicenseModal: false, showLicenseModal: false,
showResultModal: false, showResultModal: false,
@@ -68,6 +68,17 @@ const App = {
// 加载主题设置 // 加载主题设置
Utils.loadTheme() Utils.loadTheme()
// 监听路由变化
this.handleHashChange = () => {
this.currentPage = Utils.getCurrentPage()
this.searchQuery = ''
// 重置过滤结果
this.filteredProducts = [...this.products]
this.filteredPlugins = [...this.plugins]
}
Utils.onHashChange(this.handleHashChange)
// 监听滚动事件 // 监听滚动事件
const handleScroll = () => { const handleScroll = () => {
const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
@@ -82,6 +93,11 @@ const App = {
}, },
beforeUnmount() { beforeUnmount() {
// 清理路由监听器
if (this.handleHashChange) {
Utils.removeHashChangeListener(this.handleHashChange)
}
// 清理滚动事件监听器 // 清理滚动事件监听器
if (this._handleScroll) { if (this._handleScroll) {
window.removeEventListener('scroll', this._handleScroll) window.removeEventListener('scroll', this._handleScroll)
@@ -232,8 +248,7 @@ const App = {
// 页面跳转 // 页面跳转
navigateTo(page) { navigateTo(page) {
this.currentPage = page Utils.navigateToPage(page)
this.searchQuery = ''
}, },
// 返回顶部 // 返回顶部
src/main/resources/static/js/utils.js
+19
View File
@@ -180,6 +180,25 @@ const Utils = {
// 获取当前主题 // 获取当前主题
getCurrentTheme() { getCurrentTheme() {
return document.documentElement.classList.contains('dark') ? 'dark' : 'light' return document.documentElement.classList.contains('dark') ? 'dark' : 'light'
},
// 路由管理
getCurrentPage() {
const hash = window.location.hash.slice(1) // 移除 # 号
const validPages = ['home', 'products', 'plugins', 'jrebel', 'sponsor']
return validPages.includes(hash) ? hash : 'home'
},
navigateToPage(page) {
window.location.hash = page
},
onHashChange(callback) {
window.addEventListener('hashchange', callback)
},
removeHashChangeListener(callback) {
window.removeEventListener('hashchange', callback)
} }
} }