Typecho Joe 主题 添加访目录

已于 2023-04-06 16:55:10 修改
阅读量1.1k 收藏 3
点赞数
CC 4.0 BY-SA版权
分类专栏： Joe Typecho 文章标签： php 前端 javascript
于 2022-10-05 15:20:58 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_42095121/article/details/127172974
本文介绍如何在Typecho博客系统中自定义实现目录功能，包括解析文章目录、生成目录树、添加开关选项及响应式设计等步骤。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

Typecho 添加访目录

作者博客迁移到 Halo ，并使用从Joe 迁移过来的 halo-theme-joe2.0

  1. 效果图如下

    image-20221017205443351

  2. 在 core/function.php 文件中添加函数，解析目录

    /* 生成目录树 */
function _createCatalog($html) {
    global $id;
    global $catalog;

    $id = 0;
    $catalog = array();
    return preg_replace_callback('/<h([1-6])[^>]*>.*?<\/h\1>/s', static function ($match) {
        global $id;
        global $catalog;

        $tag = $match[0];
        $level = $match[1];
        $item = array(
            'id' => 'index' . $id,
            'level' => $level,
            'title' => trim(strip_tags($tag)),
            'sub' => array()
        );
        $current = array();
        if ($catalog) {
            $current = &$catalog[count($catalog) - 1];
        }
        // 根
        if (!$catalog || (isset($current['level']) && $level <= $current['level'])) {
            $catalog[] = $item;
        } else {
            while (is_array($current['sub'])) {

                // 父子关系
                if ($current['level'] == $level - 1) {
                    $current['sub'][] = $item;
                    break;
                }
                // 后代关系，不存在子菜单
                if (!$current['sub']) {
                    for ($i = $current['level'] + 1; $i < $level; $i++) {
                        $current['sub'][] = array(
                            'level' => $i,
                            'sub' => array()
                        );
                        $current = &$current['sub'][0];
                    }
                    $current['sub'][] = $item;
                    break;
                }
                // 后代关系，存在子菜单
                $current = &$current['sub'][count($current['sub']) - 1];
            }
        }
        $id++;
        return "<span class=\"anchor-fix\" id=\"{$item['id']}\" name=\"{$item['id']}\"></span>" . $tag;
    }, $html);
}

/* 输出目录树 */
function _treeMenu() {
    global $catalog;
    echo '<div>' . _buildMenuHtml($catalog) . '</div>';
}

/**
 * 构建目录树，生成索引
 *
 * @access public
 * @param $tree
 * @param bool $include
 * @return string
 */
function _buildMenuHtml($tree, bool $include = true): string {
    $menuHtml = '';
    foreach ($tree as $menu) {
        /**默认给第一个链接添加 class: .active */
        $current = ($menu['id'] === 'index0') ? 'active' : '';

        if (!isset($menu['id']) && $menu['sub']) {
            $menuHtml .= _buildMenuHtml($menu['sub'], false);
        } elseif ($menu['sub']) {
            $menuHtml .= "<li class=\"item\"><a data-scroll class=\"link {$current}\" href=\"#{$menu['id']}\" title=\"{$menu['title']}\">{$menu['title']}</a>" . _buildMenuHtml($menu['sub']) . "</li>";
        } else {
            $menuHtml .= "<li class=\"item\"><a data-scroll class=\"link {$current}\" href=\"#{$menu['id']}\" title=\"{$menu['title']}\">{$menu['title']}</a></li>";
        }
    }
    if ($include) {
        $menuHtml = '<ul class="list">' . $menuHtml . '</ul>';
    }
    return $menuHtml;
}

  3. 在 core/core.php 文件的 themeInit 函数中解析目录的代码

    # 当前载入的是文章阅读页面（包括主页相关文章）
if ($self->is('single')) {
    /* 添加目录标签 */
    if (!_isMobile() && Helper::options()->JCatalog === "on") {
        $self->content = _createCatalog($self->content);
    }
    ...
}

  4. 在 functions.php 文件中添加目录开关

    $JCatalog = new Typecho_Widget_Helper_Form_Element_Select(
    'JCatalog',
    array('off' => '关闭（默认）', 'on' => '开启'),
    'off',
    '文章页面和自定义页面将显示目录树（分辨率大于1200像素才会显示）',
    '介绍：开启后，文章页面和自定义页面将显示目录树'
);
$JCatalog->setAttribute('class', 'joe_content joe_other');
$form->addInput($JCatalog);

    效果图如下：

    image-20221005213207230

  5. 在 post.php 文件中的 <div class="joe_container"> 和 <section class="joe_aside__item menutree"> 之间加入相关代码

     <?php if ($this->options->JCatalog === "on" && !_isMobile()): ?>
    <script src="https://fastly.jsdelivr.net/npm/jquery.scrollintoview@1.9.4/jquery.scrollintoview.min.js"></script>
    <!-- 文章目录代码 -->
    <section class="joe_aside__item joe_catalog">
        <a class="icon-active" href="javascript:" onclick="hiddenHandler()" title="展开目录">
            <svg class="catalog-icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="28" height="28">
                <path d="M192.037 287.953h640.124c17.673 0 32-14.327 32-32s-14.327-32-32-32H192.037c-17.673 0-32 14.327-32 32s14.327 32 32 32zM192.028 543.17h393.608c17.673 0 32-14.327 32-32s-14.327-32-32-32H192.028c-17.673 0-32 14.327-32 32s14.327 32 32 32zM832.161 735.802H192.037c-17.673 0-32 14.327-32 32s14.327 32 32 32h640.124c17.673 0 32-14.327 32-32s-14.327-32-32-32zM705.162 671.594l160-160-160-160z"
                      fill="#000"></path>
            </svg>
        </a>
        <div class="joe_aside__item-title">
            <svg class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="28"
                 height="28">
                <path d="M838.3 895.9H197.9c-53.9 0-97.7-43.8-97.7-97.7V236.7c0-53.9 43.8-97.7 97.7-97.7h640.3c53.9 0 97.7 43.8 97.7 97.7v561.4c0.1 53.9-43.7 97.8-97.6 97.8zM197.9 203.8c-18.1 0-32.9 14.8-32.9 32.9v561.4c0 18.1 14.8 32.9 32.9 32.9h640.3c18.1 0 32.9-14.8 32.9-32.9V236.7c0-18.1-14.8-32.9-32.9-32.9H197.9z"
                      fill="#666666"></path>
                <path d="M695.1 455.2H341.2c-17.9 0-32.4-14.5-32.4-32.4s14.5-32.4 32.4-32.4h353.9c17.9 0 32.4 14.5 32.4 32.4s-14.5 32.4-32.4 32.4zM695.1 578.2H341.2c-17.9 0-32.4-14.5-32.4-32.4s14.5-32.4 32.4-32.4h353.9c17.9 0 32.4 14.5 32.4 32.4s-14.5 32.4-32.4 32.4zM695.1 701.2H341.2c-17.9 0-32.4-14.5-32.4-32.4s14.5-32.4 32.4-32.4h353.9c17.9 0 32.4 14.5 32.4 32.4s-14.5 32.4-32.4 32.4zM379.1 281.1c-17.9 0-32.4-14.5-32.4-32.4V115.4c0-17.9 14.5-32.4 32.4-32.4s32.4 14.5 32.4 32.4v133.2c0 17.9-14.5 32.5-32.4 32.5zM657.1 281.1c-17.9 0-32.4-14.5-32.4-32.4V115.4c0-17.9 14.5-32.4 32.4-32.4s32.4 14.5 32.4 32.4v133.2c0 17.9-14.5 32.5-32.4 32.5z"
                      fill="#666666"></path>
            </svg>
            <span class="text">目录</span>
            <span class="line"></span>
            <a href="javascript:" onclick="hiddenHandler()" title="隐藏目录">
                <svg class="icon-1" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="18"
                     height="18" style="">
                    <path d="M192.037 287.953h640.124c17.673 0 32-14.327 32-32s-14.327-32-32-32H192.037c-17.673 0-32 14.327-32 32s14.327 32 32 32zM832.161 479.169H438.553c-17.673 0-32 14.327-32 32s14.327 32 32 32h393.608c17.673 0 32-14.327 32-32s-14.327-32-32-32zM832.161 735.802H192.037c-17.673 0-32 14.327-32 32s14.327 32 32 32h640.124c17.673 0 32-14.327 32-32s-14.327-32-32-32zM319.028 351.594l-160 160 160 160z"
                          fill="#000"></path>
                </svg>
            </a>
        </div>
        <div class="joe_aside__item-contain" onclick="itemClick(event)">
            <?php _treeMenu(); ?>
        </div>
    </section>

    <script>
        /* 获取整个目录侧边栏对象 */
        const aside = document.getElementsByClassName("joe_catalog")[0];
        /* 获取容器 title 的高度 */
        const titleHeight = aside.children[1].offsetHeight;
        /* 获取容器高度 */
        var containHeight = aside.children[2].offsetHeight;
        // 定义一个函数来修改目录的显示长度，从而使侧边栏能自适应目录的高度，避免出现大片空白部分
        if (document.documentElement.clientHeight - 240 < containHeight) {
            containHeight = document.documentElement.clientHeight - 240;
        }
        aside.children[2].style.height = (containHeight + 20) + "px";
        aside.style.height = (titleHeight + containHeight + 25) + "px";

        // 初始化
        const JCatalog = localStorage.getItem("JOE_CATALOG")
        if (JCatalog === null) {
            localStorage.setItem("JOE_CATALOG", "on")
        }

        if (localStorage.getItem("JOE_CATALOG") === "off") {
            aside.classList.add("active");
        } else {
            aside.classList.remove("active");
        }

        // 监听点击事件，将点击的目录高亮
        const itemClick = (event) => {
            const href = event.target.getAttribute("href");
            markSwitch(href);
        }

        // 隐藏和显示目录
        const hiddenHandler = () => {
            localStorage.setItem("JOE_CATALOG", localStorage.getItem("JOE_CATALOG") === "off" ? "on" : "off")

            if (localStorage.getItem("JOE_CATALOG") === "off") {
                aside.classList.add("active");
            } else {
                aside.classList.remove("active");
            }
        }

        // 监听滚动事件，将滚动到的目录高亮
        window.onscroll = () => {
            // 触发间隔
            if (Date.now() - lastScroll > 100) {
                lastScroll = Date.now();
                handleScroll();
            }
        }

        // 上一次触发目录修改事件
        var lastScroll = Date.now();
        // 所有目录锚点元素
        var catalogElements = undefined;

        // 切换目录高亮
        const markSwitch = (tag) => {
            const links = document.querySelectorAll(".joe_catalog .link");
            for (const link of links) {
                if (link.getAttribute("href") === tag) {
                    link.classList.add("active");
                    $(link).scrollintoview({
                        duration: 2,
                        direction: "vertical",
                        viewPadding: { y: 20 }
                    });
                } else {
                    link.classList.remove("active");
                }
            }

            if (!!(window.history && history.pushState)) {
                const sUrl = window.location.href;
                const sUrlNew = sUrl.replace(/#.*$/, "") + tag;
                history.pushState(null, null, sUrlNew);
            }
        }

        // 获取元素可视距离顶部的距离
        const getElementViewTop = (element) => {
            var actualTop = element.offsetTop;
            var current = element.offsetParent;

            while (current !== null) {
                actualTop += current.offsetTop;
                current = current.offsetParent;
            }

            if (document.compatMode == "BackCompat") {
                var elementScrollTop = document.body.scrollTop;
            } else {
                var elementScrollTop = document.documentElement.scrollTop;
            }

            return actualTop - elementScrollTop;
        }

        // 滚动事件处理函数
        const handleScroll = () => {
            // 查询目录
            if (catalogElements === undefined) {
                catalogElements = document.querySelectorAll("span.anchor-fix")
            }

            for (let i = 0; i < catalogElements.length; i++) {
                const element = catalogElements[i];
                const top = getElementViewTop(element);
                if (top > 0 && top < 500) {
                    markSwitch("#" + element.id);
                    break;
                } else if (i + 1 < catalogElements.length) {
                    const nextElement = catalogElements[i + 1];
                    const nextTop = getElementViewTop(nextElement);
                    if (nextTop > 500) {
                        markSwitch("#" + element.id);
                        break;
                    }
                }
            }
        }
    </script>
<?php endif; ?>

  6. 加入 一些特别的 JS

    在 joe.global.js 中最底部的 /* 头部滚动 */ JS中修改 handleHeader 为如下格式并编译为 min.js

    const handleHeader = (diffY) => {
  if (window.pageYOffset >= $(".joe_header").height() && diffY <= 0) {
    if (flag) return;
    $(".joe_header").addClass("active");
    $(".joe_aside .joe_aside__item:last-child").css("top", $(".joe_header").height() - 60 + 15);
    $(".joe_catalog").css("top", $(".joe_header").height() - 60 + 15);
    flag = true;
  } else {
    if (!flag) return;
    $(".joe_catalog").css("top", $(".joe_header").height() + 15);
    $(".joe_header").removeClass("active");
    $(".joe_aside .joe_aside__item:last-child").css("top", $(".joe_header").height() + 15);
    flag = false;
  }
};

  7. 加入SCSS样式信息

    在 joe.post.min.scss 文件最上方加入以下SCSS样式信息并编译该文件

    /* 目录样式 */
.joe_catalog {
    position: sticky;
    width: 250px;
    background: var(--background);
    margin: 15px 15px 15px 0;
    overflow-y: auto;
    transition: top 0.35s, width 0.35s, height 0.35s;

    &.active {
        width: 45px;
        height: 45px !important;
        border-radius: 3px;
        transition: width 0.35s, height 0.35s;

        .joe_aside__item-title {
            display: none;
        }

        .joe_aside__item-contain {
            display: none;
        }

        a.icon-active {
            display: unset;
        }
    }

    a.icon-active {
        position: absolute;
        margin: 9px;
        display: none;

        &:hover {
            color: var(--theme);
        }
    }

    .joe_aside__item-title {
        a {
            position: absolute;
            right: 20px;

            &:hover {
                color: var(--theme);
            }
        }
    }
    .joe_aside__item-contain {
        overflow-y: auto;
        margin: 0 !important;
        padding: 0 !important;
    }

    .list {
        margin: 5px 0 5px 15px;

        .item {
            margin: 2px 0;

            .link {
                display: block;
                position: relative;
                color: var(--routine);
                max-width: 95%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                padding: 3px 0 3px 15px;

                &.active {
                    color: var(--theme);
                    background-color: rgba(80, 80, 80, .05);
                    border-left-color: var(--theme);
                    border-left-style: solid;
                    border-left-width: 3px;
                    transition: all 0.2s;
                }

                &:hover {
                    color: var(--theme);
                    background-color: rgba(80, 80, 80, .05);
                    border-left-color: var(--theme);
                    border-left-style: solid;
                    border-left-width: 3px;
                    transition: all 0.2s;
                }
            }
        }
    }
}

/* 锚点跳转定位 */
.anchor-fix {
    display: block;
    position: relative;
    /* 偏移量 */
    top: -120px;
}

/*在宽度小于 1200px的设备上隐藏 */
@media (max-width: 1200px) {
    .joe_catalog {
        display: none;
    }
}

本文章修改自 知识分子没文化

主要修改为：把插件形式的目录修改为主题自己的目录，修改了一些CSS样式

2022年11月19日更新 -> 加入在文章滑动时，目录自动滑动到可视范围功能

typecho 给文章加目录树
hello world
01-12 2217
第一种：普通式 效果： 下载插件后，去typecho后台安装https://github.com/wuruowuxin74/MenuTree 使用方法如下 除了文章要出现 还得添加标题，也就是出现h1,h2这样的标签，目录树才能出现。 第二种：悬浮式 效果：https://github.com/hongweipeng/MenuTree 第一步：下载插件，放在 usr/plugins/ 目录中； 第二步：激活插件； 第三种：综合式 这个需要一定基础。因为需要改模板的代码。 有两种显示方式： 弹
MenuTree:Typecho 插件 自动生成文章目录树 原作者
05-17
MenuTree Typecho插件 自动生成文章目录树 说明    原作者:Melon 原版本:0.1.0    该插件源自网上,由于找不到原作者主页且已不支持Typecho 1.1版本,所以就自己稍微改了下放到这里,如果有任何疑问, 使用方法 在文章某处地方加上<!-- index-menu -->，程序会把这个注释替换成目录树 样式 .index-menu         .index-menu-list   列表 ul .index-menu-item 每个目录项 li .index-menu-link   目录项连接 a .menu-target-fix{display: block;position: relative;top: -60px; //偏移量}   锚点定位偏移
Typecho-Joe-Theme 4.7.0.zip
01-02
Typecho-Joe-Theme 4.7.0
Joe 主题
www_5438xiazai的博客
05-09 1144
介绍： 一款非常简单，又很实用的模板，推荐一下。 1、整包仅1.3Mb，却实现超强功能，极其迅速的响应（在开发时，都是使用30000篇文章进行开发测试） 2、全站变量名、类名统一规范，重在方便更多人参与二开与拓展 3、主题开箱即用，没有任何复杂的操作，无需像其他主题去特意创建个分类等。 4、主题首发Typecho独家Joe编辑器 5、主题响应式布局，不依赖任何响应式框架，采用 Joe 独家响应式 6、主题在一切可能暴露的接口上，屏蔽sql注入、xss攻击风险，提供安全保障 7、内置超强视频功能、包含直播功能
Joe:Typecho博客主题设计与定制指南
最新发布
weixin_36149538的博客
06-15 571
<head></head><body></body>
一款基于Typecho博客的双栏极致优化主题-Joe主题
jiyc2008的博客
08-23 423
整包仅1.3Mb，却实现超强功能，极其迅速的响应（在开发时，都是使用30000篇文章进行开发测试）全站变量名、类名统一规范，重在方便更多人参与二开与拓展主题开箱即用，没有任何复杂的操作，无需像其他主题去特意创建个分类等。
探索优雅的Typecho博客主题：Joe Theme
gitblog_00017的博客
04-22 577
探索优雅的Typecho博客主题：Joe Theme 项目简介 是一款专为Typecho内容管理系统设计的精美响应式主题。这款主题以其简洁的设计、丰富的功能和良好的用户体验赢得了用户的喜爱。它旨在提供一种更高效、更美观的方式来展示你的博客内容，无论是在桌面端还是移动端。 技术分析 响应式布局 - Joe Theme采用了现代前端框架如Bootstrap，确保在各种屏幕尺寸上都能提供流畅的浏览体...
Typecho博客+Joe主题+插件 Joe 7.3.3
05-19
Typecho博客+Joe主题+插件 Joe 7.3.3Typecho博客+Joe主题+插件 Joe 7.3.3Typecho博客+Joe主题+插件 Joe 7.3.3Typecho博客+Joe主题+插件 Joe 7.3.3Typecho博客+Joe主题+插件 Joe 7.3.3Typecho博客+Joe主题+插件 Joe ...
Typecho博客+Joe主题+插件 Joe 7.3.2
05-19
Typecho博客+Joe主题+插件 Joe 7.3.2Typecho博客+Joe主题+插件 Joe 7.3.2Typecho博客+Joe主题+插件 Joe 7.3.2Typecho博客+Joe主题+插件 Joe 7.3.2Typecho博客+Joe主题+插件 Joe 7.3.2Typecho博客+Joe主题+插件 Joe ...
Typecho博客+Joe主题+插件 投稿插件
05-19
Typecho博客+Joe主题+插件 投稿插件Typecho博客+Joe主题+插件 投稿插件Typecho博客+Joe主题+插件 投稿插件Typecho博客+Joe主题+插件 投稿插件Typecho博客+Joe主题+插件 投稿插件Typecho博客+Joe主题+插件 投稿插件...
Typecho博客+Joe主题+插件 Joe 7.3.1
05-19
Typecho博客+Joe主题+插件 Joe 7.3.1Typecho博客+Joe主题+插件 Joe 7.3.1Typecho博客+Joe主题+插件 Joe 7.3.1Typecho博客+Joe主题+插件 Joe 7.3.1Typecho博客+Joe主题+插件 Joe 7.3.1Typecho博客+Joe主题+插件 Joe ...
Typecho博客+Joe主题+插件 Joe 7.3.6
05-19
Typecho博客+Joe主题+插件 Joe 7.3.6Typecho博客+Joe主题+插件 Joe 7.3.6Typecho博客+Joe主题+插件 Joe 7.3.6Typecho博客+Joe主题+插件 Joe 7.3.6Typecho博客+Joe主题+插件 Joe 7.3.6Typecho博客+Joe主题+插件 Joe ...
Typecho博客+Joe主题+插件 Joe_更新包
05-19
Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typecho博客+Joe主题+插件 Joe_更新包Typech
MenuTree:typecho插件：悬浮式文章目录树
05-24
起步 悬浮式文章目录树，定在右侧。 使用方法 第一步：下载本插件，放在 usr/plugins/ 目录中； 第二步：激活插件； 预览 github开源地址： 与我联系： 作者：hongweipeng 主页： 或者通过 Emai: 有任何问题也可评论留言
Joe懒人版，一款极美的typecho主题
m0_73240535的博客
02-13 3765
Joe主题懒人版是基于Joe主题再续前缘版修改而来（其实就是把百度上所能找到的大部分美化功能添加进去了），代码改的很乱，大佬勿喷（毕竟大部分代码原教程是什么样的，文件里面就是什么样的格式就肯定不规范）
typecho主题Joe魔改版发布（持续更新）
worm_ruchong的博客
07-20 1961
首先本主题是在原主题joe4.7.6的基础上进行了魔改，增加了一些新的功能。原Joe4.7.6作者已经不再进行维护更新，最新版本为Joe6.0.1主题预览直接看我的主题就可以了，这边就不再展示了吧！
Joe博客模板Typecho主题
banzhuan678的博客
05-11 915
简介： 本模板是基于各个模板借鉴优化出来的，本模板特点是极致性能优化与人性化配置。 功能特色： 自适应主题 代码极致优化，您所关闭不需要的功能，它并不会请求加载 如果您想学习站内某些功能是如何实现的，请在源码里查看，代码都有您想要的注释 网盘下载地址： http://kekewl.cc/z6mS1vsCAAq0 图片： ...
typecho框架Joe主题实现顶部页面图标
sxm2092115940的博客
05-02 1056
typecho框架Joe主题实现顶部页面图标
构造你独一无二的博客美化：typecho joe主题优化日志
yumuing‘s blog
01-25 5502
博主使用了typecho进行博客网站的建立，也进行了一定程度上的修改优化。配置为 1 核 2g 轻量服务器
Typecho博客Joe主题及插件最新更新包发布
资源摘要信息: "Typecho博客+Joe主题+插件 Joe_更新包" 知识点一：Typecho博客介绍 Typecho是一个开源的Weblog平台，以简洁、高效著称，采用PHP语言编写。它提供了一个简单、直观的管理界面，允许用户轻松地发布...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

憶夣

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值