mirror of
https://github.com/nagisa77/OpenIsle.git
synced 2026-04-20 10:57:28 +08:00
feat: 修改为服务端渲染、解决跳转问题
This commit is contained in:
@@ -76,7 +76,9 @@ export default {
|
|||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
const goToHome = () => {
|
const goToHome = () => {
|
||||||
router.push('/')
|
router.push('/').then(() => {
|
||||||
|
window.location.reload()
|
||||||
|
})
|
||||||
}
|
}
|
||||||
const search = () => {
|
const search = () => {
|
||||||
showSearch.value = true
|
showSearch.value = true
|
||||||
|
|||||||
@@ -245,13 +245,17 @@ export default {
|
|||||||
gotoCategory(c) {
|
gotoCategory(c) {
|
||||||
const value = encodeURIComponent(c.id ?? c.name)
|
const value = encodeURIComponent(c.id ?? c.name)
|
||||||
this.$router
|
this.$router
|
||||||
.push({ path: '/', query: { category: value } })
|
.push({ path: '/', query: { category: value } }).then(() => {
|
||||||
|
window.location.reload()
|
||||||
|
})
|
||||||
this.handleItemClick()
|
this.handleItemClick()
|
||||||
},
|
},
|
||||||
gotoTag(t) {
|
gotoTag(t) {
|
||||||
const value = encodeURIComponent(t.id ?? t.name)
|
const value = encodeURIComponent(t.id ?? t.name)
|
||||||
this.$router
|
this.$router
|
||||||
.push({ path: '/', query: { tags: value } })
|
.push({ path: '/', query: { tags: value } }).then(() => {
|
||||||
|
window.location.reload()
|
||||||
|
})
|
||||||
this.handleItemClick()
|
this.handleItemClick()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -133,10 +133,6 @@ export default {
|
|||||||
},
|
},
|
||||||
async setup() {
|
async setup() {
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
|
|
||||||
/**
|
|
||||||
* -------- 1. PARAMS & REFS --------
|
|
||||||
*/
|
|
||||||
const selectedCategory = ref('')
|
const selectedCategory = ref('')
|
||||||
if (route.query.category) {
|
if (route.query.category) {
|
||||||
const c = decodeURIComponent(route.query.category)
|
const c = decodeURIComponent(route.query.category)
|
||||||
@@ -169,16 +165,6 @@ export default {
|
|||||||
const pageSize = 10
|
const pageSize = 10
|
||||||
const allLoaded = ref(false)
|
const allLoaded = ref(false)
|
||||||
|
|
||||||
/**
|
|
||||||
* -------- 2. INIT FETCH FOR SSR --------
|
|
||||||
* 服务端渲染阶段也需要获取首页内容和选项。
|
|
||||||
*/
|
|
||||||
await loadOptions()
|
|
||||||
await fetchContent()
|
|
||||||
|
|
||||||
/**
|
|
||||||
* -------- 3. FETCH OPTION HELPERS --------
|
|
||||||
*/
|
|
||||||
const loadOptions = async () => {
|
const loadOptions = async () => {
|
||||||
if (selectedCategory.value && !isNaN(selectedCategory.value)) {
|
if (selectedCategory.value && !isNaN(selectedCategory.value)) {
|
||||||
try {
|
try {
|
||||||
@@ -242,9 +228,6 @@ export default {
|
|||||||
return url
|
return url
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* -------- 4. FETCH CORE --------
|
|
||||||
*/
|
|
||||||
const fetchPosts = async (reset = false) => {
|
const fetchPosts = async (reset = false) => {
|
||||||
if (reset) {
|
if (reset) {
|
||||||
page.value = 0
|
page.value = 0
|
||||||
@@ -296,7 +279,12 @@ export default {
|
|||||||
if (isLoadingPosts.value || allLoaded.value) return
|
if (isLoadingPosts.value || allLoaded.value) return
|
||||||
try {
|
try {
|
||||||
isLoadingPosts.value = true
|
isLoadingPosts.value = true
|
||||||
const res = await fetch(buildRankUrl())
|
const token = getToken()
|
||||||
|
const res = await fetch(buildRankUrl(), {
|
||||||
|
headers: {
|
||||||
|
Authorization: token ? `Bearer ${token}` : ''
|
||||||
|
}
|
||||||
|
})
|
||||||
isLoadingPosts.value = false
|
isLoadingPosts.value = false
|
||||||
if (!res.ok) return
|
if (!res.ok) return
|
||||||
const data = await res.json()
|
const data = await res.json()
|
||||||
@@ -333,7 +321,12 @@ export default {
|
|||||||
if (isLoadingPosts.value || allLoaded.value) return
|
if (isLoadingPosts.value || allLoaded.value) return
|
||||||
try {
|
try {
|
||||||
isLoadingPosts.value = true
|
isLoadingPosts.value = true
|
||||||
const res = await fetch(buildReplyUrl())
|
const token = getToken()
|
||||||
|
const res = await fetch(buildReplyUrl(), {
|
||||||
|
headers: {
|
||||||
|
Authorization: token ? `Bearer ${token}` : ''
|
||||||
|
}
|
||||||
|
})
|
||||||
isLoadingPosts.value = false
|
isLoadingPosts.value = false
|
||||||
if (!res.ok) return
|
if (!res.ok) return
|
||||||
const data = await res.json()
|
const data = await res.json()
|
||||||
@@ -363,11 +356,11 @@ export default {
|
|||||||
|
|
||||||
const fetchContent = async (reset = false) => {
|
const fetchContent = async (reset = false) => {
|
||||||
if (selectedTopic.value === '排行榜') {
|
if (selectedTopic.value === '排行榜') {
|
||||||
fetchRanking(reset)
|
await fetchRanking(reset)
|
||||||
} else if (selectedTopic.value === '最新回复') {
|
} else if (selectedTopic.value === '最新回复') {
|
||||||
fetchLatestReply(reset)
|
await fetchLatestReply(reset)
|
||||||
} else {
|
} else {
|
||||||
fetchPosts(reset)
|
await fetchPosts(reset)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -383,6 +376,9 @@ export default {
|
|||||||
|
|
||||||
const sanitizeDescription = text => stripMarkdown(text)
|
const sanitizeDescription = text => stripMarkdown(text)
|
||||||
|
|
||||||
|
await loadOptions()
|
||||||
|
await fetchContent()
|
||||||
|
|
||||||
return {
|
return {
|
||||||
topics,
|
topics,
|
||||||
selectedTopic,
|
selectedTopic,
|
||||||
|
|||||||
@@ -86,9 +86,15 @@ export function handleMarkdownClick(e) {
|
|||||||
|
|
||||||
export function stripMarkdown(text) {
|
export function stripMarkdown(text) {
|
||||||
const html = md.render(text || '')
|
const html = md.render(text || '')
|
||||||
const el = document.createElement('div')
|
// SSR 环境下没有 document
|
||||||
el.innerHTML = html
|
if (typeof window === 'undefined') {
|
||||||
return el.textContent || el.innerText || ''
|
// 用正则去除 HTML 标签
|
||||||
|
return html.replace(/<[^>]+>/g, '').replace(/\s+/g, ' ').trim()
|
||||||
|
} else {
|
||||||
|
const el = document.createElement('div')
|
||||||
|
el.innerHTML = html
|
||||||
|
return el.textContent || el.innerText || ''
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export function stripMarkdownLength(text, length) {
|
export function stripMarkdownLength(text, length) {
|
||||||
|
|||||||
Reference in New Issue
Block a user