diff --git a/src/pages/index/index.jsx b/src/pages/index/index.jsx index 1bb0196..fa71bdc 100644 --- a/src/pages/index/index.jsx +++ b/src/pages/index/index.jsx @@ -3,7 +3,7 @@ import Taro from "@tarojs/taro"; import { View, Text, Image, Button } from "@tarojs/components"; import "./index.scss"; import { AtTabBar } from "taro-ui"; -import React, { useCallback, useEffect, useState } from "react"; +import React, { useCallback, useEffect, useState, useRef } from "react"; import { AtGrid } from "taro-ui"; import { Swiper, SwiperItem } from "@tarojs/components"; import { AtCard } from "taro-ui"; @@ -12,6 +12,11 @@ import { AtButton } from "taro-ui"; import { AtSearchBar } from "taro-ui"; import { Picker } from "@tarojs/components"; import { AtList, AtListItem, AtNavBar, AtTag, AtMessage } from "taro-ui"; +import { marked } from "marked"; +import infoText from "../book/info.md"; +import bookText from "../book/book.md"; +import index from "./index.md"; + import { AtModal, AtModalHeader, @@ -80,7 +85,39 @@ const Index = () => { const [bookpay, setbookpay] = useState(0); const [isWeChat, setisWeChat] = useState(false); + const [markText, setmarkText] = useState(vip == 1 ? index : index); + const [headers, setHeaders] = useState([]); // 存储所有

的内容 + const contentRef = useRef(null); // 用于获取渲染后的 DOM + marked.setOptions({ + breaks: true, // 是否回车换行 + gfm: true, //使用经批准的 GitHub Flavored Markdown (GFM) 规范 + // pedantic: true, //严格模式 + // highlight(code:any, lang:any) { + // // 语法高亮 + // let val = code; + // if (lang) { + // val = hljs.highlight(lang, code).value; + // } else { + // val = hljs.highlightAuto(code).value; + // } + // return val; + // }, + }); + useEffect(() => { + if (contentRef.current) { + const h1Elements = contentRef.current.querySelectorAll("h1"); + const h2Elements = contentRef.current.querySelectorAll("h2"); + + const h1Texts = Array.from(h1Elements).map((el) => el.textContent); + const h2Texts = Array.from(h2Elements).map((el) => el.textContent); + + setHeaders(h1Texts); + // console.log("获取到的 H1 标题:"); // 控制台查看 + console.log("获取到的 H1 标题:", h1Texts); // 控制台查看 + console.log("获取到的 H2 标题:", h2Texts); // 控制台查看 + } + }, [markText]); // 监听 HTML 内容变化 const getOpenidFromUrl = (url) => { const pattern = /[?&]openid=([^&#]+)/; const match = url.match(pattern); @@ -400,13 +437,21 @@ const Index = () => { - 聊天机器人 - 智能AI回复/加群 + 不只云手机 + 折腾技术 + - + {vip != 1 ? ( { @@ -416,8 +461,8 @@ const Index = () => { return false; } else { if (!!isWeChat) { - //98元 - payh5("vip", 9800); + //58元 + payh5("vip", 5800); } else { window.location.href = `https://mp.weixin.qq.com/s/16xcMIgxEEGBPY7fanNq0g`; } @@ -428,18 +473,24 @@ const Index = () => { size="small" circle > - 加群 + {`${"加 入 交 流"}`} ) : ( - { - window.location.href = `https://memos.hackrobot.org`; - }}>👉星球地址: memos.hackrobot.org + { + window.location.href = `https://memos.hackrobot.org`; + }} + > + 👉星球地址: memos.hackrobot.org + - 添加微信好友: hackrobot + + 添加 + 微信好友: hackrobot + 获取 账号 - )} diff --git a/src/pages/index/index.md b/src/pages/index/index.md new file mode 100644 index 0000000..6e6fd91 --- /dev/null +++ b/src/pages/index/index.md @@ -0,0 +1,6 @@ +👋 还在一个人摸索吗？ +📚 资源共享 & 问答，遇到问题,即时响应 +🌟 在这里，你能得到： +✅ 业务方向（无人直播, RPA自动化,聊天机器人） +✅ 技术杠杆（云手机,PVE虚拟化,服务器集群） +✅ 海外平台（YouTube、TikTok、Saas） diff --git a/src/pages/index/index.scss b/src/pages/index/index.scss index e764228..3a20956 100644 --- a/src/pages/index/index.scss +++ b/src/pages/index/index.scss @@ -1,3 +1,71 @@ +// 在 src/index.scss 中引入 GitHub Markdown 主题 +@import "github-markdown-css/github-markdown.css"; +// marktext的换行处理 +.markdown-body p, +.markdown-body blockquote, +.markdown-body ul, +.markdown-body ol, +.markdown-body dl, +.markdown-body table, +.markdown-body pre, +.markdown-body details { + margin-bottom: 10px; +} + +.markdown-body li > p { + margin-top: 0px; +} +.markVip { + padding-left: 100px; + padding-right: 100px; +} +.markdown-body p { + font-size: 30px; +} +.book_header_div { + width: 100%; + height: 80px; +} +.book_header { + position: fixed; + top: 0px; + width: 100%; + height: 80px; + // background-color: aquamarine; + // background-color: #f0f5ff; + border-bottom: 2px solid #f0f5ff; + background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); + + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + .book_header_left { + width: 100px; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + color: #69b1ff; + } + .book_header_middle { + flex: 1; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + color: #69b1ff; + } + .book_header_right { + width: 100px; + // background-color: yellow; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + color: #69b1ff; + } +} .index { // background-color: #002329; // width: 100vw; @@ -135,7 +203,7 @@ .left_btn { // position: fixed; - // bottom: 10px; + // bottom: -10px; margin-top: 40px; // background-color: aqua;