优化首页数据加载逻辑,优先使用 SSR 注入数据
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
- 修改 setIndexData 函数接收 commentObj 参数 - 优先使用 window.__themeCommon(SSR 注入数据) - 其次使用 sessionStorage 缓存数据 - 最后降级到 AJAX 请求 - 添加空值检查防止报错 - 支持主题配置插件的合作伙伴配置 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
70
js/index.js
70
js/index.js
@@ -84,9 +84,9 @@ $(function () {
|
||||
}
|
||||
isRecommend();
|
||||
// 设置首页函数
|
||||
function setIndexData() {
|
||||
const commentObj = JSON.parse(sessionStorage.commentData);
|
||||
if (commentObj.honor.length > 0) {
|
||||
function setIndexData(commentObj) {
|
||||
// 荣誉资质
|
||||
if (commentObj.honor && commentObj.honor.length > 0) {
|
||||
commentObj.honor.forEach((item) => {
|
||||
$("#certBox").append(`<div class="cert-item">
|
||||
<img src=${item.img} alt="">
|
||||
@@ -94,30 +94,33 @@ $(function () {
|
||||
</div>`);
|
||||
});
|
||||
}
|
||||
if (commentObj.partner.length > 0 && commentObj.partner.length <= 3) {
|
||||
commentObj.partner.forEach((item) => {
|
||||
$("#practiceBox").append(`<div class="practice-box">
|
||||
<img src="${item.img}" alt="">
|
||||
<div class="mt-10">${item.description}</div>
|
||||
<p class="tr font-grey mt-20 font12">${item.name}</p>
|
||||
</div>`);
|
||||
});
|
||||
} else if (commentObj.partner.length > 3) {
|
||||
const arr1 = commentObj.partner.slice(0, 3);
|
||||
const arr2 = commentObj.partner.slice(3);
|
||||
arr1.forEach((item) => {
|
||||
$("#practiceBox").append(`<div class="practice-box">
|
||||
<img src="${item.img}" alt="">
|
||||
<div class="mt-10">${item.description}</div>
|
||||
<p class="tr font-grey mt-20 font12">${item.name}</p>
|
||||
</div>`);
|
||||
});
|
||||
$("#morPracticeBox").attr("style", "display: flex;");
|
||||
arr2.forEach((item) => {
|
||||
$("#morPracticeBox").append(` <div class="brand-box">
|
||||
// 合作伙伴
|
||||
if (commentObj.partner && commentObj.partner.length > 0) {
|
||||
if (commentObj.partner.length <= 3) {
|
||||
commentObj.partner.forEach((item) => {
|
||||
$("#practiceBox").append(`<div class="practice-box">
|
||||
<img src="${item.img}" alt="">
|
||||
</div>`);
|
||||
});
|
||||
<div class="mt-10">${item.description}</div>
|
||||
<p class="tr font-grey mt-20 font12">${item.name}</p>
|
||||
</div>`);
|
||||
});
|
||||
} else {
|
||||
const arr1 = commentObj.partner.slice(0, 3);
|
||||
const arr2 = commentObj.partner.slice(3);
|
||||
arr1.forEach((item) => {
|
||||
$("#practiceBox").append(`<div class="practice-box">
|
||||
<img src="${item.img}" alt="">
|
||||
<div class="mt-10">${item.description}</div>
|
||||
<p class="tr font-grey mt-20 font12">${item.name}</p>
|
||||
</div>`);
|
||||
});
|
||||
$("#morPracticeBox").attr("style", "display: flex;");
|
||||
arr2.forEach((item) => {
|
||||
$("#morPracticeBox").append(` <div class="brand-box">
|
||||
<img src="${item.img}" alt="">
|
||||
</div>`);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
// 获取通用配置信息
|
||||
@@ -130,12 +133,21 @@ $(function () {
|
||||
},
|
||||
success: function (res) {
|
||||
sessionStorage.commentData = JSON.stringify(res.data);
|
||||
setIndexData();
|
||||
setIndexData(res.data);
|
||||
},
|
||||
});
|
||||
}
|
||||
// 获取首页数据
|
||||
getCommentInfo();
|
||||
// 获取首页数据 - 优先使用 SSR 注入的数据
|
||||
if (window.__themeCommon) {
|
||||
// 如果有 SSR 数据,直接使用
|
||||
setIndexData(window.__themeCommon);
|
||||
} else if (sessionStorage.commentData) {
|
||||
// 如果有缓存数据,使用缓存
|
||||
setIndexData(JSON.parse(sessionStorage.commentData));
|
||||
} else {
|
||||
// 否则通过 AJAX 获取
|
||||
getCommentInfo();
|
||||
}
|
||||
var viewer = new Viewer(document.getElementById("viewer"), {
|
||||
button: true,
|
||||
inline: false,
|
||||
|
||||
Reference in New Issue
Block a user