活字格隐藏加载背景并替换加载方法

概述

在活字格中通过 JavaScript 替换默认的页面加载遮罩方法，实现自定义加载动画或直接隐藏加载效果。

核心代码

// 替换活字格自带的隐藏加载方法
Forguncy.PageBuilder.hidePageLoadingCover = function() {
    console.log("隐藏加载遮罩");

    // 调用原始的隐藏方法
    var cover = Forguncy.PageBuilder?.pageLoadingCover;
    if (cover) {
        cover.hide();
    }

    // 此处可添加自定义逻辑
    // 例如：显示自定义加载完成提示
    showCustomToast("页面加载完成");
};

功能说明

• 替换加载方法：通过重写 hidePageLoadingCover 函数，拦截活字格默认的加载隐藏逻辑
• 保留原始功能：代码中仍调用了原始的 hide()，确保遮罩正常消失
• 扩展能力：在隐藏加载后可以执行自定义逻辑

应用场景

• 自定义加载动画样式（替换默认的旋转图标）
• 在加载完成后显示欢迎提示
• 记录页面加载耗时用于性能监控
• 实现骨架屏（Skeleton Screen）加载效果
• 加载完成后自动执行特定业务逻辑

自定义加载动画示例

// 显示自定义加载动画
function showCustomLoading() {
    var loader = document.createElement("div");
    loader.id = "custom-loader";
    loader.innerHTML = "<div class='spinner'></div>";
    document.body.appendChild(loader);
}

// 隐藏自定义加载动画
function hideCustomLoading() {
    var loader = document.getElementById("custom-loader");
    if (loader) loader.remove();
}

// 替换活字格方法
Forguncy.PageBuilder.hidePageLoadingCover = function() {
    Forguncy.PageBuilder.pageLoadingCover?.hide();
    hideCustomLoading();
};

注意事项

• 此方法通过猴子补丁（Monkey Patch）修改，注意活字格版本升级后的兼容性
• 建议在页面加载的最早期执行此代码
• 使用可选链 ?. 避免空指针异常

标签：