Runtime API Examples
更新: 9/4/2025字数: 0 字 时长: 0 分钟
This page demonstrates usage of some of the runtime APIs provided by VitePress.
The main useData() API can be used to access site, theme, and page data for the current page. It works in both .md and .vue files:
md
<script setup>
import { useData } from 'vitepress'
const { theme, page, frontmatter } = useData()
</script>
## Results
### Theme Data
<pre>{{ theme }}</pre>
### Page Data
<pre>{{ page }}</pre>
### Page Frontmatter
<pre>{{ frontmatter }}</pre>Results
Theme Data
{
"logo": "/avatar.png",
"nav": [
{
"text": "主页",
"link": "/column/Personal/index.md"
},
{
"text": "AI",
"link": "/column/AIFuture/index.md"
},
{
"text": "React",
"link": "/column/React/index.md"
},
{
"text": "Vue",
"link": "/column/Vue/index.md"
},
{
"text": "Next.js",
"link": "/column/Next/index.md"
},
{
"text": "Node.js",
"link": "/column/Node/index.md"
},
{
"text": "Python",
"link": "/column/Python/index.md"
},
{
"text": "网络相关",
"link": "/column/Network/index.md"
},
{
"text": "服务与部署",
"items": [
{
"text": "Nginx常用",
"link": "/column/Nginx/index.md"
},
{
"text": "Docker常用",
"link": "/column/Docker/index.md"
},
{
"text": "阿里云ECS",
"link": "/column/Aliyun/index.md"
}
]
},
{
"text": "更多",
"items": [
{
"text": "进阶",
"items": [
{
"text": "Angular",
"link": "/column/Angular/index.md"
},
{
"text": "JS进阶",
"link": "/column/JS/index.md"
},
{
"text": "TS进阶",
"link": "/column/TS/index.md"
},
{
"text": "Git常用",
"link": "/column/Git/index.md"
},
{
"text": "项目相关",
"link": "/column/Project/"
},
{
"text": "小程序相关",
"link": "/column/miniProgram/"
},
{
"text": "HTML/CSS",
"link": "/column/HtmlCss/index.md"
}
]
},
{
"text": "前端生态",
"items": [
{
"text": "框架组件",
"link": "/column/Ecology/com.md"
},
{
"text": "工程化相关",
"link": "/column/Ecology/project.md"
},
{
"text": "HTML/CSS",
"link": "/column/Ecology/html-css.md"
},
{
"text": "工具推荐",
"link": "/column/Recommend/index.md"
},
{
"text": "常见面试题",
"link": "/column/Interview/index.md"
}
]
},
{
"text": "问题笔记",
"items": [
{
"text": "踩坑记录",
"link": "/column/ProblemNotes/踩坑记录/"
},
{
"text": "日常笔记",
"link": "/column/ProblemNotes/日常笔记/"
}
]
}
]
},
{
"text": "其它",
"items": [
{
"text": "样式测试",
"link": "/column/StyleText/index.md"
},
{
"text": "更新记录",
"link": "/column/UpdateLog/changelog.md"
},
{
"text": "诗词相关",
"link": "/column/Poetry/index.md"
},
{
"text": "生活常识",
"link": "/column/CommonSense/index.md"
}
]
}
],
"sidebar": {
"/column/JS/": [
{
"text": "JS核心机制",
"items": [
{
"text": "语言基础",
"items": [
{
"text": "标准JS和浏览器JS的区别",
"link": "/column/JS/JS核心机制/语言基础/标准JS和浏览器JS的区别.md"
},
{
"text": "typeof与instanceof区别",
"link": "/column/JS/JS核心机制/语言基础/typeof与instanceof区别.md"
},
{
"text": "匿名函数和箭头函数",
"link": "/column/JS/JS核心机制/语言基础/匿名函数和箭头函数.md"
},
{
"text": "双重否定与空值合并运算符",
"link": "/column/JS/JS核心机制/语言基础/双重否定与空值合并运算符.md"
},
{
"text": "展开运算符的使用",
"link": "/column/JS/JS核心机制/语言基础/展开运算符的使用.md"
},
{
"text": "类型转换",
"link": "/column/JS/JS核心机制/语言基础/类型转换.md"
},
{
"text": "Error精细化处理",
"link": "/column/JS/JS核心机制/语言基础/Error精细化处理.md"
},
{
"text": "ES6Module模块化跨域问题",
"link": "/column/JS/JS核心机制/语言基础/ES6Module模块化跨域问题.md"
},
{
"text": "console多种打印方式",
"link": "/column/JS/JS核心机制/语言基础/console多种打印方式.md"
}
]
},
{
"text": "面向对象",
"items": [
{
"text": "原型和原型链",
"link": "/column/JS/JS核心机制/面向对象/原型和原型链.md"
},
{
"text": "this指向问题",
"link": "/column/JS/JS核心机制/面向对象/this指向问题.md"
},
{
"text": "Proxy与Reflect",
"link": "/column/JS/JS核心机制/面向对象/Proxy与Reflect.md"
}
]
},
{
"text": "异步编程",
"items": [
{
"text": "promise讲解",
"link": "/column/JS/JS核心机制/异步编程/promise讲解.md"
},
{
"text": "promise.all和race进阶",
"link": "/column/JS/JS核心机制/异步编程/promise.all和race进阶.md"
},
{
"text": "generator和async讲解",
"link": "/column/JS/JS核心机制/异步编程/generator和async讲解.md"
},
{
"text": "AbortController请求中断",
"link": "/column/JS/JS核心机制/异步编程/AbortController请求中断.md"
},
{
"text": "requestAnimationFrame",
"link": "/column/JS/JS核心机制/异步编程/requestAnimationFrame.md"
},
{
"text": "IntersectionObserver",
"link": "/column/JS/JS核心机制/异步编程/IntersectionObserver.md"
},
{
"text": "IntersectionObserver实现高效懒加载",
"link": "/column/JS/JS核心机制/异步编程/IntersectionObserver实现高效懒加载.md"
}
]
}
]
},
{
"text": "数据操作与处理",
"items": [
{
"text": "数组处理",
"items": [
{
"text": "常用的浅拷贝和深拷贝",
"link": "/column/JS/数据操作与处理/数组处理/常用的浅拷贝和深拷贝.md"
},
{
"text": "forEach进阶",
"link": "/column/JS/数据操作与处理/数组处理/forEach进阶.md"
},
{
"text": "sort使用场景",
"link": "/column/JS/数据操作与处理/数组处理/sort使用场景.md"
},
{
"text": "高阶函数reduce",
"link": "/column/JS/数据操作与处理/数组处理/高阶函数reduce.md"
},
{
"text": "数组新增常用方法",
"link": "/column/JS/数据操作与处理/数组处理/数组新增常用方法.md"
},
{
"text": "for in和for of循环的区别",
"link": "/column/JS/数据操作与处理/数组处理/for in和for of循环的区别.md"
},
{
"text": "Iterator迭代器和for of循环",
"link": "/column/JS/数据操作与处理/数组处理/Iterator迭代器和for of循环.md"
}
]
},
{
"text": "字符串处理",
"items": [
{
"text": "split和join区别",
"link": "/column/JS/数据操作与处理/字符串处理/split和join区别.md"
},
{
"text": "字符串新增常用方法",
"link": "/column/JS/数据操作与处理/字符串处理/字符串新增常用方法.md"
},
{
"text": "toLocaleString常用场景",
"link": "/column/JS/数据操作与处理/字符串处理/toLocaleString常用场景.md"
}
]
},
{
"text": "对象处理",
"items": [
{
"text": "对象、数组和字符串方法总结",
"link": "/column/JS/数据操作与处理/对象处理/对象、数组和字符串方法总结.md"
},
{
"text": "对象新增的一些常用方法",
"link": "/column/JS/数据操作与处理/对象处理/对象新增的一些常用方法.md"
},
{
"text": "URLSearchParams获取参数",
"link": "/column/JS/数据操作与处理/对象处理/URLSearchParams获取参数.md"
}
]
}
]
},
{
"text": "浏览器与DOM操作",
"items": [
{
"text": "事件冒泡和事件委托",
"link": "/column/JS/浏览器与DOM操作/事件冒泡和事件委托.md"
},
{
"text": "关于BOM浏览器对象模型",
"link": "/column/JS/浏览器与DOM操作/关于BOM浏览器对象模型.md"
},
{
"text": "getBoundingClientRect使用",
"link": "/column/JS/浏览器与DOM操作/getBoundingClientRect使用.md"
},
{
"text": "offset、client、scroll区别",
"link": "/column/JS/浏览器与DOM操作/offset、client、scroll区别.md"
},
{
"text": "重排和重绘的区别",
"link": "/column/JS/浏览器与DOM操作/重排和重绘的区别.md"
}
]
}
],
"/column/Vue/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "生命周期",
"link": "/column/Vue/基础/生命周期.md"
},
{
"text": "计算属性",
"link": "/column/Vue/基础/计算属性.md"
},
{
"text": "类与样式绑定",
"link": "/column/Vue/基础/类与样式绑定.md"
},
{
"text": "列表渲染",
"link": "/column/Vue/基础/列表渲染.md"
},
{
"text": "动态组件",
"link": "/column/Vue/基础/动态组件.md"
},
{
"text": "Watch监听",
"link": "/column/Vue/基础/Watch监听.md"
},
{
"text": "Slots插槽",
"link": "/column/Vue/基础/Slots插槽.md"
},
{
"text": "defineExpose",
"link": "/column/Vue/基础/defineExpose.md"
},
{
"text": "Attributes属性透传",
"link": "/column/Vue/基础/Attributes属性透传.md"
},
{
"text": "Mixin混入(不推荐)",
"link": "/column/Vue/基础/Mixin混入(不推荐).md"
},
{
"text": "组件注册和组件通信",
"link": "/column/Vue/基础/组件注册和组件通信.md"
}
]
},
{
"text": "深入组件",
"collapsed": false,
"items": [
{
"text": "reactive和ref区别",
"link": "/column/Vue/深入组件/reactive和ref区别.md"
},
{
"text": "vue是mvvm模型吗",
"link": "/column/Vue/深入组件/vue是mvvm模型吗.md"
},
{
"text": "scoped属性原理",
"link": "/column/Vue/深入组件/scoped属性原理.md"
},
{
"text": "依赖注入",
"link": "/column/Vue/深入组件/依赖注入.md"
},
{
"text": "异步组件",
"link": "/column/Vue/深入组件/异步组件.md"
}
]
},
{
"text": "内置组件",
"collapsed": false,
"items": [
{
"text": "Teleport",
"link": "/column/Vue/内置组件/Teleport.md"
},
{
"text": "Transition",
"link": "/column/Vue/内置组件/Transition.md"
},
{
"text": "KeepAlive",
"link": "/column/Vue/内置组件/KeepAlive.md"
},
{
"text": "Suspense",
"link": "/column/Vue/内置组件/Suspense.md"
}
]
},
{
"text": "响应式API进阶",
"collapsed": false,
"items": [
{
"text": "toRefs",
"link": "/column/Vue/响应式API进阶/toRefs.md"
},
{
"text": "readonly",
"link": "/column/Vue/响应式API进阶/readonly.md"
},
{
"text": "toRaw",
"link": "/column/Vue/响应式API进阶/toRaw.md"
},
{
"text": "markRaw",
"link": "/column/Vue/响应式API进阶/markRaw.md"
},
{
"text": "shallowRef",
"link": "/column/Vue/响应式API进阶/shallowRef.md"
},
{
"text": "shallowReactive",
"link": "/column/Vue/响应式API进阶/shallowReactive.md"
},
{
"text": "shallowReadonly",
"link": "/column/Vue/响应式API进阶/shallowReadonly.md"
},
{
"text": "watchEffect",
"link": "/column/Vue/响应式API进阶/watchEffect.md"
},
{
"text": "watchPostEffect",
"link": "/column/Vue/响应式API进阶/watchPostEffect.md"
},
{
"text": "watchSyncEffect",
"link": "/column/Vue/响应式API进阶/watchSyncEffect.md"
},
{
"text": "useId",
"link": "/column/Vue/响应式API进阶/useId.md"
},
{
"text": "reactive视图未更新",
"link": "/column/Vue/响应式API进阶/reactive视图未更新.md"
}
]
},
{
"text": "构建打包相关",
"collapsed": false,
"items": [
{
"text": "publicPath讲解",
"link": "/column/Vue/构建打包相关/publicPath讲解.md"
},
{
"text": "环境变量和NODE_ENV",
"link": "/column/Vue/构建打包相关/环境变量和NODE_ENV.md"
},
{
"text": "vue.config.js",
"link": "/column/Vue/构建打包相关/vue.config.js.md"
},
{
"text": "index.html中获取环境",
"link": "/column/Vue/构建打包相关/index.html中获取环境.md"
}
]
},
{
"text": "Vite相关",
"collapsed": false,
"items": [
{
"text": "依赖预构建",
"link": "/column/Vue/Vite相关/依赖预构建.md"
},
{
"text": "常用优化插件",
"link": "/column/Vue/Vite相关/常用优化插件.md"
},
{
"text": "使用Eslint",
"link": "/column/Vue/Vite相关/使用Eslint.md"
}
]
},
{
"text": "第三方库使用",
"collapsed": false,
"items": [
{
"text": "VueX详解",
"link": "/column/Vue/第三方库使用/VueX详解.md"
},
{
"text": "VueUse工具集",
"link": "/column/Vue/第三方库使用/VueUse工具集.md"
},
{
"text": "I18n国际化",
"link": "/column/Vue/第三方库使用/I18n国际化.md"
},
{
"text": "Pinia状态管理",
"link": "/column/Vue/第三方库使用/Pinia状态管理.md"
},
{
"text": "Echarts绘制地图",
"link": "/column/Vue/第三方库使用/Echarts绘制地图.md"
},
{
"text": "打包可视化分析",
"link": "/column/Vue/第三方库使用/打包可视化分析.md"
},
{
"text": "VueRouter路由导航",
"link": "/column/Vue/第三方库使用/VueRouter路由导航.md"
},
{
"text": "clipboardjs复制文本",
"link": "/column/Vue/第三方库使用/clipboardjs复制文本.md"
},
{
"text": "BOS百度对象存储",
"link": "/column/Vue/第三方库使用/BOS百度对象存储.md"
},
{
"text": "Canvas图片合并",
"link": "/column/Vue/第三方库使用/Canvas图片合并.md"
},
{
"text": "图片添加水印和截图",
"link": "/column/Vue/第三方库使用/图片添加水印和截图.md"
}
]
},
{
"text": "其它",
"collapsed": false,
"items": [
{
"text": "路由传参的三种方式",
"link": "/column/Vue/其它/路由传参的三种方式.md"
},
{
"text": "常见的性能优化",
"link": "/column/Vue/其它/常见的性能优化.md"
},
{
"text": "常见的移动端rem适配方案",
"link": "/column/Vue/其它/常见的移动端rem适配方案.md"
},
{
"text": "腾讯地图使用",
"link": "/column/Vue/其它/腾讯地图使用.md"
},
{
"text": "优雅的vue2项目总体结构",
"link": "/column/Vue/其它/优雅的vue2项目总体结构.md"
},
{
"text": "路由匹配和懒加载",
"link": "/column/Vue/其它/路由匹配和懒加载.md"
},
{
"text": "webpack的基本使用和总结",
"link": "/column/Vue/其它/webpack的基本使用和总结.md"
}
]
}
],
"/column/React/": [
{
"text": "组件",
"collapsed": false,
"items": [
{
"text": "Fiber架构",
"link": "/column/React/组件/Fiber架构.md"
},
{
"text": "认识组件",
"link": "/column/React/组件/认识组件.md"
},
{
"text": "组件通信",
"link": "/column/React/组件/组件通信.md"
},
{
"text": "受控组件",
"link": "/column/React/组件/受控组件.md"
},
{
"text": "传送组件",
"link": "/column/React/组件/传送组件.md"
},
{
"text": "异步组件",
"link": "/column/React/组件/异步组件.md"
},
{
"text": "严格模式",
"link": "/column/React/组件/严格模式.md"
}
]
},
{
"text": "CSS方案",
"collapsed": false,
"items": [
{
"text": "css modules",
"link": "/column/React/CSS方案/css modules.md"
},
{
"text": "css 原子化",
"link": "/column/React/CSS方案/css 原子化.md"
},
{
"text": "css in js(不推荐)",
"link": "/column/React/CSS方案/css in js(不推荐).md"
}
]
},
{
"text": "Hooks",
"collapsed": false,
"items": [
{
"text": "useState",
"link": "/column/React/Hooks/useState.md"
},
{
"text": "useState更新机制",
"link": "/column/React/Hooks/useState更新机制.md"
},
{
"text": "useReducer",
"link": "/column/React/Hooks/useReducer.md"
},
{
"text": "useSyncExternalStore",
"link": "/column/React/Hooks/useSyncExternalStore.md"
},
{
"text": "useTransition",
"link": "/column/React/Hooks/useTransition.md"
},
{
"text": "useDeferredValue",
"link": "/column/React/Hooks/useDeferredValue.md"
}
]
},
{
"text": "副作用",
"collapsed": false,
"items": [
{
"text": "useEffect",
"link": "/column/React/副作用/useEffect.md"
},
{
"text": "利用useEffect处理竟态操作",
"link": "/column/React/副作用/利用useEffect处理竟态操作.md"
},
{
"text": "useLayoutEffect",
"link": "/column/React/副作用/useLayoutEffect.md"
},
{
"text": "useInsertionEffect",
"link": "/column/React/副作用/useInsertionEffect.md"
}
]
},
{
"text": "状态传递",
"collapsed": false,
"items": [
{
"text": "useRef",
"link": "/column/React/状态传递/useRef.md"
},
{
"text": "useImperativeHandle",
"link": "/column/React/状态传递/useImperativeHandle.md"
},
{
"text": "createContext与useContext",
"link": "/column/React/状态传递/createContext与useContext.md"
}
]
},
{
"text": "性能优化",
"collapsed": false,
"items": [
{
"text": "父组件变化导致子组件重新渲染",
"link": "/column/React/性能优化/父组件变化导致子组件重新渲染.md"
},
{
"text": "useMemo和React.memo",
"link": "/column/React/性能优化/useMemo和React.memo.md"
},
{
"text": "useCallback",
"link": "/column/React/性能优化/useCallback.md"
},
{
"text": "使用函数引用作为依赖项",
"link": "/column/React/性能优化/使用函数引用作为依赖项.md"
}
]
},
{
"text": "其它相关",
"collapsed": false,
"items": [
{
"text": "Immer库使用",
"link": "/column/React/其它相关/Immer库使用.md"
},
{
"text": "Hooks为什么不能写到判断里面",
"link": "/column/React/其它相关/Hooks为什么不能写到判断里面.md"
},
{
"text": "自定义Hooks的封装",
"link": "/column/React/其它相关/自定义Hooks的封装.md"
},
{
"text": "函数式组件中使用Redux",
"link": "/column/React/其它相关/函数式组件中使用Redux.md"
},
{
"text": "AntDesign项目集成阿里Iconfont图标库",
"link": "/column/React/其它相关/AntDesign项目集成阿里Iconfont图标库.md"
}
]
},
{
"text": "Zustand",
"collapsed": false,
"items": [
{
"text": "基本使用",
"link": "/column/React/Zustand/基本使用.md"
},
{
"text": "Immer和持久化",
"link": "/column/React/Zustand/Immer和持久化.md"
},
{
"text": "状态简化",
"link": "/column/React/Zustand/状态简化.md"
},
{
"text": "状态订阅",
"link": "/column/React/Zustand/状态订阅.md"
}
]
}
],
"/column/Node/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "npm package.json",
"link": "/column/Node/基础/npm package.json.md"
},
{
"text": "npm install原理",
"link": "/column/Node/基础/npm install原理.md"
},
{
"text": "npm run原理",
"link": "/column/Node/基础/npm run原理.md"
},
{
"text": "npx 命令",
"link": "/column/Node/基础/npx 命令.md"
},
{
"text": "全局变量",
"link": "/column/Node/基础/全局变量.md"
},
{
"text": "模块化规范",
"link": "/column/Node/基础/模块化规范.md"
},
{
"text": "模块查找规则",
"link": "/column/Node/基础/模块查找规则.md"
},
{
"text": "nvm相关",
"link": "/column/Node/基础/nvm相关.md"
},
{
"text": "fnm管理node版本",
"link": "/column/Node/基础/fnm管理node版本.md"
},
{
"text": "npm serve",
"link": "/column/Node/基础/npm serve.md"
},
{
"text": "pnpm解决幽灵依赖",
"link": "/column/Node/基础/pnpm解决幽灵依赖.md"
}
]
},
{
"text": "内置模块",
"collapsed": false,
"items": [
{
"text": "path 模块",
"link": "/column/Node/内置模块/path 模块.md"
},
{
"text": "os 模块",
"link": "/column/Node/内置模块/os 模块.md"
},
{
"text": "fs 模块",
"link": "/column/Node/内置模块/fs 模块.md"
},
{
"text": "process 模块",
"link": "/column/Node/内置模块/process 模块.md"
},
{
"text": "events 模块",
"link": "/column/Node/内置模块/events 模块.md"
},
{
"text": "http 模块",
"link": "/column/Node/内置模块/http 模块.md"
},
{
"text": "crypto 模块",
"link": "/column/Node/内置模块/crypto 模块.md"
},
{
"text": "express 模块",
"link": "/column/Node/内置模块/express 模块.md"
}
]
},
{
"text": "MySQL",
"collapsed": false,
"items": [
{
"text": "关系型和非关系型数据库",
"link": "/column/Node/MySQL/关系型和非关系型数据库.md"
},
{
"text": "数据类型",
"link": "/column/Node/MySQL/数据类型.md"
},
{
"text": "基础语法",
"link": "/column/Node/MySQL/基础语法.md"
},
{
"text": "SQL查询的本质",
"link": "/column/Node/MySQL/SQL查询的本质.md"
},
{
"text": "事务理解",
"link": "/column/Node/MySQL/事务理解.md"
},
{
"text": "关联关系",
"link": "/column/Node/MySQL/关联关系.md"
},
{
"text": "JOIN连接操作",
"link": "/column/Node/MySQL/JOIN连接操作.md"
},
{
"text": "表达式和函数",
"link": "/column/Node/MySQL/表达式和函数.md"
},
{
"text": "实战演练",
"link": "/column/Node/MySQL/实战演练.md"
},
{
"text": "请求数据",
"link": "/column/Node/MySQL/请求数据.md"
},
{
"text": "knex",
"link": "/column/Node/MySQL/knex.md"
},
{
"text": "prisma",
"link": "/column/Node/MySQL/prisma.md"
},
{
"text": "better-sqlite3",
"link": "/column/Node/MySQL/better-sqlite3.md"
}
]
}
],
"/column/Next/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "了解Nextjs的哲学思想",
"link": "/column/Next/基础/了解Nextjs的哲学思想.md"
},
{
"text": "了解CSR、SSR、SSG",
"link": "/column/Next/基础/了解CSR、SSR、SSG.md"
},
{
"text": "什么是RSC渲染",
"link": "/column/Next/基础/什么是RSC渲染.md"
},
{
"text": "服务端和客户端组件",
"link": "/column/Next/基础/服务端和客户端组件.md"
},
{
"text": "路由系统",
"items": [
{
"text": "Pages Router和App Router",
"link": "/column/Next/基础/路由系统/Pages Router和App Router.md"
},
{
"text": "客户端页面路由",
"link": "/column/Next/基础/路由系统/客户端页面路由.md"
},
{
"text": "平行路由",
"link": "/column/Next/基础/路由系统/平行路由.md"
},
{
"text": "路由组",
"link": "/column/Next/基础/路由系统/路由组.md"
},
{
"text": "服务端API路由",
"link": "/column/Next/基础/路由系统/服务端API路由.md"
}
]
},
{
"text": "layout页面布局",
"link": "/column/Next/基础/layout页面布局.md"
}
]
},
{
"text": "进阶",
"collapsed": false,
"items": [
{
"text": "集成aiSDK",
"link": "/column/Next/进阶/集成aiSDK.md"
},
{
"text": "自定义Document",
"link": "/column/Next/进阶/自定义Document.md"
},
{
"text": "自定义错误页面",
"link": "/column/Next/进阶/自定义错误页面.md"
},
{
"text": "middleware中间件",
"link": "/column/Next/进阶/middleware中间件.md"
},
{
"text": "图像优化",
"link": "/column/Next/进阶/图像优化.md"
},
{
"text": "Script组件",
"link": "/column/Next/进阶/Script组件.md"
},
{
"text": "Turbopack构建工具",
"link": "/column/Next/进阶/Turbopack构建工具.md"
},
{
"text": "NextRequest和NextResponse",
"link": "/column/Next/进阶/NextRequest和NextResponse.md"
},
{
"text": "常见鉴权方案",
"link": "/column/Next/进阶/常见鉴权方案.md"
},
{
"text": "NextAuth认证",
"link": "/column/Next/进阶/NextAuth认证.md"
},
{
"text": "NextAuth认证常见问题",
"link": "/column/Next/进阶/NextAuth认证常见问题.md"
},
{
"text": "Nextjs打包为什么比较大",
"link": "/column/Next/进阶/Nextjs打包为什么比较大.md"
}
]
}
],
"/column/Python/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "基础语法入门",
"link": "/column/Python/基础/基础语法入门.md"
},
{
"text": "基础项目环境搭建流程",
"link": "/column/Python/基础/基础项目环境搭建流程.md"
},
{
"text": "导入导出模块化",
"link": "/column/Python/基础/导入导出模块化.md"
},
{
"text": "Pip包管理工具",
"link": "/column/Python/基础/Pip包管理工具.md"
},
{
"text": "Env环境变量管理",
"link": "/column/Python/基础/Env环境变量管理.md"
},
{
"text": "类型注解详解",
"link": "/column/Python/基础/类型注解详解.md"
},
{
"text": "__name__与__main__",
"link": "/column/Python/基础/__name__与__main__.md"
},
{
"text": "Async异步编程",
"link": "/column/Python/基础/Async异步编程.md"
},
{
"text": "With语句详解",
"link": "/column/Python/基础/With语句详解.md"
},
{
"text": "常用内置模块",
"link": "/column/Python/基础/常用内置模块.md"
}
]
},
{
"text": "进阶",
"collapsed": false,
"items": [
{
"text": "Web框架FastAPI",
"link": "/column/Python/进阶/Web框架FastAPI.md"
},
{
"text": "typing",
"link": "/column/Python/进阶/typing.md"
},
{
"text": "requests",
"link": "/column/Python/进阶/requests.md"
},
{
"text": "sqlalchemy",
"link": "/column/Python/进阶/sqlalchemy.md"
}
]
}
],
"/column/AIFuture/": [
{
"text": "基础认知",
"collapsed": false,
"items": [
{
"text": "AI概念与AI Agent",
"link": "/column/AIFuture/基础认知/AI概念与AI Agent.md"
},
{
"text": "AI模型中的token是什么",
"link": "/column/AIFuture/基础认知/AI模型中的token是什么.md"
},
{
"text": "什么是提示词工程",
"link": "/column/AIFuture/基础认知/什么是提示词工程.md"
},
{
"text": "什么是RAG检索增强生成",
"link": "/column/AIFuture/基础认知/什么是RAG检索增强生成.md"
},
{
"text": "什么是MCP协议",
"link": "/column/AIFuture/基础认知/什么是MCP协议.md"
},
{
"text": "什么是模型蒸馏",
"link": "/column/AIFuture/基础认知/什么是模型蒸馏.md"
}
]
},
{
"text": "工具提效",
"collapsed": false,
"items": [
{
"text": "AGENTS规则约束",
"items": [
{
"text": "什么是AGENTS.md",
"link": "/column/AIFuture/工具提效/AGENTS规则约束/什么是AGENTS.md.md"
},
{
"text": "前端专用AGENTS.md模板",
"link": "/column/AIFuture/工具提效/AGENTS规则约束/前端专用AGENTS.md模板.md"
},
{
"text": "后端专用AGENTS.md模板",
"link": "/column/AIFuture/工具提效/AGENTS规则约束/后端专用AGENTS.md模板.md"
}
]
},
{
"text": "Agent Skills",
"link": "/column/AIFuture/工具提效/Agent Skills.md"
}
]
},
{
"text": "趋势观察",
"collapsed": false,
"items": [
{
"text": "从卷模型到卷产品：AI应用层的机会在哪",
"link": "/column/AIFuture/趋势观察/从卷模型到卷产品：AI应用层的机会在哪.md"
},
{
"text": "AI变成基础设施之后，什么最值钱",
"link": "/column/AIFuture/趋势观察/AI变成基础设施之后，什么最值钱.md"
},
{
"text": "开发者的AI生存手册：哪些技能在贬值",
"link": "/column/AIFuture/趋势观察/开发者的AI生存手册：哪些技能在贬值.md"
}
]
}
],
"/column/Network/": [
{
"text": "网络基础",
"collapsed": false,
"items": [
{
"text": "OSI七层网络模型详解",
"link": "/column/Network/网络基础/OSI七层网络模型详解.md"
},
{
"text": "TCP-IP协议和三次握手",
"link": "/column/Network/网络基础/TCP-IP协议和三次握手.md"
},
{
"text": "浏览器输入URL发生了什么",
"link": "/column/Network/网络基础/浏览器输入URL发生了什么.md"
},
{
"text": "本地开发端口原理",
"link": "/column/Network/网络基础/本地开发端口原理.md"
},
{
"text": "网络常用命令集锦",
"link": "/column/Network/网络基础/网络常用命令集锦.md"
}
]
},
{
"text": "网络通信与传输",
"collapsed": false,
"items": [
{
"text": "HTTP基础讲解",
"link": "/column/Network/网络通信与传输/HTTP基础讲解.md"
},
{
"text": "HTTP1.1和HTTP2",
"link": "/column/Network/网络通信与传输/HTTP1.1和HTTP2.md"
},
{
"text": "HTTPS(TSL和SSL)",
"link": "/column/Network/网络通信与传输/HTTPS(TSL和SSL).md"
},
{
"text": "GET和POST请求区别",
"link": "/column/Network/网络通信与传输/GET和POST请求区别.md"
},
{
"text": "CDN内容分发网络",
"link": "/column/Network/网络通信与传输/CDN内容分发网络.md"
},
{
"text": "强缓存和协商缓存",
"link": "/column/Network/网络通信与传输/强缓存和协商缓存.md"
},
{
"text": "Fetch请求和Ajax",
"link": "/column/Network/网络通信与传输/Fetch请求和Ajax.md"
},
{
"text": "RESTful API设计规范",
"link": "/column/Network/网络通信与传输/RESTful API设计规范.md"
},
{
"text": "对象存储服务讲解",
"link": "/column/Network/网络通信与传输/对象存储服务讲解.md"
},
{
"text": "客户端数据库IndexedDB",
"link": "/column/Network/网络通信与传输/客户端数据库IndexedDB.md"
},
{
"text": "获取网络状态",
"link": "/column/Network/网络通信与传输/获取网络状态.md"
},
{
"text": "SSE流式传输",
"link": "/column/Network/网络通信与传输/SSE流式传输.md"
}
]
},
{
"text": "安全与数据上报",
"collapsed": false,
"items": [
{
"text": "XSS跨站脚本攻击与防御",
"link": "/column/Network/安全与数据上报/XSS跨站脚本攻击与防御.md"
},
{
"text": "跨域原理解决方案",
"link": "/column/Network/安全与数据上报/跨域原理解决方案.md"
},
{
"text": "JWT与Cookie讲解",
"link": "/column/Network/安全与数据上报/JWT与Cookie讲解.md"
},
{
"text": "数字证书简述",
"link": "/column/Network/安全与数据上报/数字证书简述.md"
},
{
"text": "添加埋点方式和原理",
"link": "/column/Network/安全与数据上报/添加埋点方式和原理.md"
},
{
"text": "sendBeacon可靠上报",
"link": "/column/Network/安全与数据上报/sendBeacon可靠上报.md"
},
{
"text": "OAuth2.0授权流程",
"link": "/column/Network/安全与数据上报/OAuth2.0授权流程.md"
},
{
"text": "HttpOnly签名Cookie登录方案",
"link": "/column/Network/安全与数据上报/HttpOnly签名Cookie登录方案.md"
}
]
},
{
"text": "工具与抓包分析",
"collapsed": false,
"items": [
{
"text": "Wireshark抓包分析实战",
"link": "/column/Network/工具与抓包分析/Wireshark抓包分析实战.md"
},
{
"text": "Ngrok内网穿透配置",
"link": "/column/Network/工具与抓包分析/Ngrok内网穿透配置.md"
}
]
}
],
"/column/Angular/": [
{
"text": "基础",
"collapsed": false,
"items": [
{
"text": "概念",
"link": "/column/Angular/基础/概念.md"
},
{
"text": "组件",
"link": "/column/Angular/基础/组件.md"
},
{
"text": "数据绑定",
"link": "/column/Angular/基础/数据绑定.md"
},
{
"text": "管道Pipe",
"link": "/column/Angular/基础/管道Pipe.md"
},
{
"text": "服务和依赖注入",
"link": "/column/Angular/基础/服务和依赖注入.md"
},
{
"text": "http客户端",
"link": "/column/Angular/基础/http客户端.md"
},
{
"text": "Signal(信号)",
"link": "/column/Angular/基础/Signal(信号).md"
},
{
"text": "路由和导航",
"link": "/column/Angular/基础/路由和导航.md"
}
]
},
{
"text": "Ngrx",
"collapsed": false,
"items": [
{
"text": "基本使用",
"link": "/column/Angular/Ngrx/基本使用.md"
}
]
},
{
"text": "RxJs",
"collapsed": false,
"items": [
{
"text": "基本使用",
"link": "/column/Angular/RxJs/基本使用.md"
}
]
}
],
"/column/TS/": [
{
"text": "基础类型系统",
"collapsed": false,
"items": [
{
"text": "ts介绍",
"link": "/column/TS/基础类型系统/ts介绍.md"
},
{
"text": "内置类型",
"link": "/column/TS/基础类型系统/内置类型.md"
},
{
"text": "索引签名",
"link": "/column/TS/基础类型系统/索引签名.md"
},
{
"text": "交叉类型",
"link": "/column/TS/基础类型系统/交叉类型.md"
},
{
"text": "泛型使用",
"link": "/column/TS/基础类型系统/泛型使用.md"
},
{
"text": "非空断言操作符",
"link": "/column/TS/基础类型系统/非空断言操作符.md"
},
{
"text": "as const类型收窄",
"link": "/column/TS/基础类型系统/as const类型收窄.md"
},
{
"text": "type和interface",
"link": "/column/TS/基础类型系统/type和interface.md"
},
{
"text": "字面量类型赋值问题",
"link": "/column/TS/基础类型系统/字面量类型赋值问题.md"
},
{
"text": "keyof T & on${string}组合",
"link": "/column/TS/基础类型系统/keyof T & on${string}组合.md"
},
{
"text": "unknown、never、any区别",
"link": "/column/TS/基础类型系统/unknown、never、any区别.md"
},
{
"text": "Object、object、{}区别",
"link": "/column/TS/基础类型系统/Object、object、{}区别.md"
}
]
},
{
"text": "类型工具",
"collapsed": false,
"items": [
{
"text": "Record类型",
"link": "/column/TS/类型工具/Record类型.md"
},
{
"text": "Partial类型",
"link": "/column/TS/类型工具/Partial类型.md"
},
{
"text": "Pick类型",
"link": "/column/TS/类型工具/Pick类型.md"
},
{
"text": "Omit类型",
"link": "/column/TS/类型工具/Omit类型.md"
},
{
"text": "Required类型",
"link": "/column/TS/类型工具/Required类型.md"
},
{
"text": "Exclude类型",
"link": "/column/TS/类型工具/Exclude类型.md"
},
{
"text": "Extract类型",
"link": "/column/TS/类型工具/Extract类型.md"
},
{
"text": "NonNullable类型",
"link": "/column/TS/类型工具/NonNullable类型.md"
}
]
},
{
"text": "工程化相关",
"collapsed": false,
"items": [
{
"text": "tsconfig.json配置文件",
"link": "/column/TS/工程化相关/tsconfig.json配置文件.md"
},
{
"text": "三斜线指令",
"link": "/column/TS/工程化相关/三斜线指令.md"
},
{
"text": "命名空间",
"link": "/column/TS/工程化相关/命名空间.md"
},
{
"text": "声明文件",
"link": "/column/TS/工程化相关/声明文件.md"
},
{
"text": "装饰器Decorator",
"link": "/column/TS/工程化相关/装饰器Decorator.md"
},
{
"text": "协变和逆变",
"link": "/column/TS/工程化相关/协变和逆变.md"
},
{
"text": "类型守卫",
"link": "/column/TS/工程化相关/类型守卫.md"
}
]
}
],
"/column/HtmlCss/": [
{
"text": "HTML",
"collapsed": false,
"items": [
{
"text": "HTML理论基础",
"link": "/column/HtmlCss/HTML/HTML理论基础.md"
},
{
"text": "HTML5新特性",
"link": "/column/HtmlCss/HTML/HTML5新特性.md"
},
{
"text": "HTML元数据标签及常用元素",
"link": "/column/HtmlCss/HTML/HTML元数据标签及常用元素.md"
},
{
"text": "HTML5视频做天气卡片背景",
"link": "/column/HtmlCss/HTML/HTML5视频做天气卡片背景.md"
}
]
},
{
"text": "CSS",
"collapsed": false,
"items": [
{
"text": "CSS理论知识点",
"link": "/column/HtmlCss/CSS/CSS理论知识点.md"
},
{
"text": "宽度100与宽度auto的区别",
"link": "/column/HtmlCss/CSS/宽度100与宽度auto的区别.md"
},
{
"text": "CSS的root选择器",
"link": "/column/HtmlCss/CSS/CSS的root选择器.md"
},
{
"text": "CSS预处理器和后处理器",
"link": "/column/HtmlCss/CSS/CSS预处理器和后处理器.md"
},
{
"text": "自动前缀autoprefixer",
"link": "/column/HtmlCss/CSS/自动前缀autoprefixer.md"
},
{
"text": "实现上下渐变的框线",
"link": "/column/HtmlCss/CSS/实现上下渐变的框线.md"
},
{
"text": "盒子水平垂直居中的几种方式",
"link": "/column/HtmlCss/CSS/盒子水平垂直居中的几种方式.md"
},
{
"text": "绝对定位与Flex布局冲突解决",
"link": "/column/HtmlCss/CSS/绝对定位与Flex布局冲突解决.md"
},
{
"text": "类选择器中间有无空格的区别",
"link": "/column/HtmlCss/CSS/类选择器中间有无空格的区别.md"
},
{
"text": "实现文本单行居中多行左对齐",
"link": "/column/HtmlCss/CSS/实现文本单行居中多行左对齐.md"
},
{
"text": "transform影响fixed定位",
"link": "/column/HtmlCss/CSS/transform影响fixed定位.md"
},
{
"text": "@media print 打印样式",
"link": "/column/HtmlCss/CSS/@media print 打印样式.md"
}
]
}
],
"/column/Git/": [
{
"text": "git相关",
"collapsed": false,
"items": [
{
"text": "git安装与常用命令",
"link": "/column/Git/git相关/git安装与常用命令.md"
},
{
"text": "github配置ssh密钥",
"link": "/column/Git/git相关/github配置ssh密钥.md"
},
{
"text": "工作中常用的git操作-1",
"link": "/column/Git/git相关/工作中常用的git操作-1.md"
},
{
"text": "工作中常用的git操作-2",
"link": "/column/Git/git相关/工作中常用的git操作-2.md"
},
{
"text": "git版本回退的两种方式",
"link": "/column/Git/git相关/git版本回退的两种方式.md"
},
{
"text": "git首次推送冲突完整解决流程",
"link": "/column/Git/git相关/git首次推送冲突完整解决流程.md"
},
{
"text": "git同时推送到多个远程仓库",
"link": "/column/Git/git相关/git同时推送到多个远程仓库.md"
},
{
"text": "git远程分支同步到本地",
"link": "/column/Git/git相关/git远程分支同步到本地.md"
},
{
"text": "git多人协作分支合并实战",
"link": "/column/Git/git相关/git多人协作分支合并实战.md"
}
]
}
],
"/column/Nginx/": [
{
"text": "Nginx服务器与部署",
"collapsed": false,
"items": [
{
"text": "核心概念",
"link": "/column/Nginx/Nginx服务器与部署/核心概念.md"
},
{
"text": "location匹配规则",
"link": "/column/Nginx/Nginx服务器与部署/location匹配规则.md"
},
{
"text": "alias和root区别",
"link": "/column/Nginx/Nginx服务器与部署/alias和root区别.md"
},
{
"text": "部署项目和代理",
"link": "/column/Nginx/Nginx服务器与部署/部署项目和代理.md"
},
{
"text": "负载均衡策略",
"link": "/column/Nginx/Nginx服务器与部署/负载均衡策略.md"
},
{
"text": "开启gzip压缩",
"link": "/column/Nginx/Nginx服务器与部署/开启gzip压缩.md"
},
{
"text": "开启域名跳转",
"link": "/column/Nginx/Nginx服务器与部署/开启域名跳转.md"
},
{
"text": "History路由404问题",
"link": "/column/Nginx/Nginx服务器与部署/History路由404问题.md"
},
{
"text": "ECS上用Nginx部署多个前端项目",
"link": "/column/Nginx/Nginx服务器与部署/ECS上用Nginx部署多个前端项目.md"
}
]
}
],
"/column/Docker/": [
{
"text": "Docker容器与部署",
"collapsed": false,
"items": [
{
"text": "核心概念和安装",
"link": "/column/Docker/Docker容器与部署/核心概念和安装.md"
},
{
"text": "Docker的镜像与容器",
"link": "/column/Docker/Docker容器与部署/Docker的镜像与容器.md"
},
{
"text": "Dockerfile",
"link": "/column/Docker/Docker容器与部署/Dockerfile.md"
},
{
"text": "Docker Compose",
"link": "/column/Docker/Docker容器与部署/Docker Compose.md"
},
{
"text": "Docker网络",
"link": "/column/Docker/Docker容器与部署/Docker网络.md"
},
{
"text": "容器存储",
"link": "/column/Docker/Docker容器与部署/容器存储.md"
},
{
"text": "容器日志和监控",
"link": "/column/Docker/Docker容器与部署/容器日志和监控.md"
},
{
"text": "Docker本地部署CSR前端项目",
"link": "/column/Docker/Docker容器与部署/Docker本地部署CSR前端项目.md"
},
{
"text": "Docker本地部署SSR前端项目",
"link": "/column/Docker/Docker容器与部署/Docker本地部署SSR前端项目.md"
}
]
}
],
"/column/Aliyun/": [
{
"text": "核心概念",
"collapsed": false,
"items": [
{
"text": "阿里云 ECS 入门介绍",
"link": "/column/Aliyun/核心概念/阿里云 ECS 入门介绍.md"
},
{
"text": "阿里云的容器镜像服务讲解",
"link": "/column/Aliyun/核心概念/阿里云的容器镜像服务讲解.md"
},
{
"text": "阿里云安全组和服务器防火墙",
"link": "/column/Aliyun/核心概念/阿里云安全组和服务器防火墙.md"
},
{
"text": "为什么前端项目部署需要nginx",
"link": "/column/Aliyun/核心概念/为什么前端项目部署需要nginx.md"
},
{
"text": "GitHub Actions 核心概念详解",
"link": "/column/Aliyun/核心概念/GitHub Actions 核心概念详解.md"
},
{
"text": "PM2在Next项目部署中的作用",
"link": "/column/Aliyun/核心概念/PM2在Next项目部署中的作用.md"
},
{
"text": "SQLite 和 better-sqlite3介绍",
"link": "/column/Aliyun/核心概念/SQLite 和 better-sqlite3介绍.md"
}
]
},
{
"text": "实战部署",
"collapsed": false,
"items": [
{
"text": "VitePress博客自动部署到ECS",
"link": "/column/Aliyun/实战部署/VitePress博客自动部署到ECS.md"
},
{
"text": "Next项目自动部署到ECS-初始版",
"link": "/column/Aliyun/实战部署/Next项目自动部署到ECS-初始版.md"
},
{
"text": "Next项目自动部署到ECS-优化版",
"link": "/column/Aliyun/实战部署/Next项目自动部署到ECS-优化版.md"
},
{
"text": "Nuxt项目自动部署到ECS",
"link": "/column/Aliyun/实战部署/Nuxt项目自动部署到ECS.md"
},
{
"text": "ECS+Nginx配置二级域名与多项目部署实战",
"link": "/column/Aliyun/实战部署/ECS+Nginx配置二级域名与多项目部署实战.md"
},
{
"text": "PythonWeb项目发布到ECS实战",
"link": "/column/Aliyun/实战部署/PythonWeb项目发布到ECS实战.md"
},
{
"text": "React+Node+SQLite项目自动发布到ECS实战-git看板",
"link": "/column/Aliyun/实战部署/React+Node+SQLite项目自动发布到ECS实战-git看板.md"
},
{
"text": "Next.js+SQLite项目自动部署到ECS全流程",
"link": "/column/Aliyun/实战部署/Next.js+SQLite项目自动部署到ECS全流程.md"
},
{
"text": "React+Node+SQLite项目自动发布到ECS实战-天气看板",
"link": "/column/Aliyun/实战部署/React+Node+SQLite项目自动发布到ECS实战-天气看板.md"
}
]
},
{
"text": "踩坑记录",
"collapsed": false,
"items": [
{
"text": "ECS中通过SSH克隆GitHub仓库",
"link": "/column/Aliyun/踩坑记录/ECS中通过SSH克隆GitHub仓库.md"
}
]
}
],
"/column/miniProgram/": [
{
"text": "uniApp",
"collapsed": false,
"items": [
{
"text": "1. 页面常用的生命周期",
"link": "/column/miniProgram/uniApp/页面常用的生命周期.md"
},
{
"text": "2. uniApp中使用pinia状态管理库与持久化",
"link": "/column/miniProgram/uniApp/uniApp中使用pinia状态管理库与持久化.md"
},
{
"text": "3. 自动按需引入组件(easycom)",
"link": "/column/miniProgram/uniApp/自动按需引入组件(easycom).md"
}
]
},
{
"text": "weixin",
"collapsed": false,
"items": [
{
"text": "1. 微信小程序的登录流程",
"link": "/column/miniProgram/weixin/微信小程序的登录流程.md"
},
{
"text": "2. 微信小程序返回上一个页面并刷新数据",
"link": "/column/miniProgram/weixin/微信小程序返回上一个页面并刷新数据.md"
},
{
"text": "3. 微信小程序页面之间传参的几种方式",
"link": "/column/miniProgram/weixin/微信小程序页面之间传参的几种方式.md"
}
]
},
{
"text": "alipay",
"collapsed": false,
"items": [
{
"text": "1. 支付宝不支持将自定义组件当page使用",
"link": "/column/miniProgram/alipay/支付宝不支持将自定义组件当page使用.md"
},
{
"text": "2. 支付宝小程序引导用户开启定位",
"link": "/column/miniProgram/alipay/支付宝小程序引导用户开启定位.md"
}
]
}
],
"/column/Project/": [
{
"text": "组件封装",
"collapsed": false,
"items": [
{
"text": "录音组件",
"link": "/column/Project/组件封装/录音组件.md"
},
{
"text": "png序列动画",
"link": "/column/Project/组件封装/png序列动画.md"
},
{
"text": "可编辑模板字符串",
"link": "/column/Project/组件封装/可编辑模板字符串.md"
},
{
"text": "各格式文件预览",
"link": "/column/Project/组件封装/各格式文件预览.md"
},
{
"text": "神策埋点",
"link": "/column/Project/组件封装/神策埋点.md"
},
{
"text": "移动端下拉刷新功能的实现",
"link": "/column/Project/组件封装/移动端下拉刷新功能的实现.md"
},
{
"text": "移动端B站风格弹幕系统实现方案",
"link": "/column/Project/组件封装/移动端B站风格弹幕系统实现方案.md"
}
]
},
{
"text": "表单与表格专题",
"collapsed": false,
"items": [
{
"text": "实现[记住密码]功能",
"link": "/column/Project/表单与表格专题/实现[记住密码]功能.md"
},
{
"text": "常用form表单验证",
"link": "/column/Project/表单与表格专题/常用form表单验证.md"
},
{
"text": "form表单嵌套table表格",
"link": "/column/Project/表单与表格专题/form表单嵌套table表格.md"
},
{
"text": "动态切换不同form表单",
"link": "/column/Project/表单与表格专题/动态切换不同form表单.md"
},
{
"text": "合并行列且循环的table表格",
"link": "/column/Project/表单与表格专题/合并行列且循环的table表格.md"
},
{
"text": "移动端的table表格实现",
"link": "/column/Project/表单与表格专题/移动端的table表格实现.md"
}
]
},
{
"text": "文件处理专题",
"collapsed": false,
"items": [
{
"text": "前端文件处理完全指南：File、Blob、Base64转换",
"link": "/column/Project/文件处理专题/前端文件处理完全指南：File、Blob、Base64转换.md"
},
{
"text": "前端实现文件下载的完整流程",
"link": "/column/Project/文件处理专题/前端实现文件下载的完整流程.md"
},
{
"text": "前端PDF渲染与下载实现",
"link": "/column/Project/文件处理专题/前端PDF渲染与下载实现.md"
},
{
"text": "把页面导出为PDF",
"link": "/column/Project/文件处理专题/把页面导出为PDF.md"
},
{
"text": "使用 XLSX.js 导出 Excel 文件",
"link": "/column/Project/文件处理专题/使用 XLSX.js 导出 Excel 文件.md"
}
]
},
{
"text": "性能与架构",
"collapsed": false,
"items": [
{
"text": "import动态导入使用与高级应用",
"link": "/column/Project/性能与架构/import动态导入使用与高级应用.md"
},
{
"text": "网站图片优化方案",
"link": "/column/Project/性能与架构/网站图片优化方案.md"
},
{
"text": "客户端和服务器端渲染区别",
"link": "/column/Project/性能与架构/客户端和服务器端渲染区别.md"
},
{
"text": "前端常用加密方式",
"link": "/column/Project/性能与架构/前端常用加密方式.md"
},
{
"text": "防抖和节流函数细节",
"link": "/column/Project/性能与架构/防抖和节流函数细节.md"
},
{
"text": "构建时Hash与ContentHash的差异详解",
"link": "/column/Project/性能与架构/构建时Hash与ContentHash的差异详解.md"
},
{
"text": "NProgress页面加载进度条原理",
"link": "/column/Project/性能与架构/NProgress页面加载进度条原理.md"
}
]
}
],
"/column/ProblemNotes/踩坑记录/": [
{
"text": "踩坑记录",
"collapsed": false,
"items": [
{
"text": "项目部署后静态资源404问题",
"link": "/column/ProblemNotes/踩坑记录/项目部署后静态资源404问题.md"
},
{
"text": "Vue2使用sort排序导致死循环",
"link": "/column/ProblemNotes/踩坑记录/Vue2使用sort排序导致死循环.md"
},
{
"text": "IOS橡皮筋滚动回弹效果异常修复",
"link": "/column/ProblemNotes/踩坑记录/IOS橡皮筋滚动回弹效果异常修复.md"
},
{
"text": "IOS系统video标签poster属性兼容性处理",
"link": "/column/ProblemNotes/踩坑记录/IOS系统video标签poster属性兼容性处理.md"
},
{
"text": "Mac钉钉微应用流式输出TypeError Load failed错误排查",
"link": "/column/ProblemNotes/踩坑记录/Mac钉钉微应用流式输出TypeError Load failed错误排查.md"
},
{
"text": "前端流式输出数据被浏览器截断",
"link": "/column/ProblemNotes/踩坑记录/前端流式输出数据被浏览器截断.md"
},
{
"text": "项目发版后浏览器缓存问题",
"link": "/column/ProblemNotes/踩坑记录/项目发版后浏览器缓存问题.md"
},
{
"text": "React19高危RCE漏洞预警与修复",
"link": "/column/ProblemNotes/踩坑记录/React19高危RCE漏洞预警与修复.md"
},
{
"text": "移动端软键盘弹出时会把fixed底部按钮顶上去",
"link": "/column/ProblemNotes/踩坑记录/移动端软键盘弹出时会把fixed底部按钮顶上去.md"
},
{
"text": "录入to find mores使后端报错",
"link": "/column/ProblemNotes/踩坑记录/录入to find mores使后端报错.md"
},
{
"text": "跨源资源共享存在不安全配置漏洞",
"link": "/column/ProblemNotes/踩坑记录/跨源资源共享存在不安全配置漏洞.md"
},
{
"text": "Nextjs16页面循环刷新问题",
"link": "/column/ProblemNotes/踩坑记录/Nextjs16页面循环刷新问题.md"
},
{
"text": "iOS底部TabBar安全区适配",
"link": "/column/ProblemNotes/踩坑记录/iOS底部TabBar安全区适配.md"
}
]
}
],
"/column/ProblemNotes/日常笔记/": [
{
"text": "日常笔记",
"collapsed": false,
"items": [
{
"text": "VitePress首屏加载优化实战",
"link": "/column/ProblemNotes/日常笔记/VitePress首屏加载优化实战.md"
},
{
"text": "软件设计五大核心原则",
"link": "/column/ProblemNotes/日常笔记/软件设计五大核心原则.md"
},
{
"text": "前端运行时与编译时的理解",
"link": "/column/ProblemNotes/日常笔记/前端运行时与编译时的理解.md"
},
{
"text": "JavaScript常用函数与算法精粹",
"link": "/column/ProblemNotes/日常笔记/JavaScript常用函数与算法精粹.md"
},
{
"text": "页面阅读位置记忆功能实现方案",
"link": "/column/ProblemNotes/日常笔记/页面阅读位置记忆功能实现方案.md"
},
{
"text": "前端本地开发构建和更新的过程",
"link": "/column/ProblemNotes/日常笔记/前端本地开发构建和更新的过程.md"
},
{
"text": "SVG与Canvas水印添加技术对比",
"link": "/column/ProblemNotes/日常笔记/SVG与Canvas水印添加技术对比.md"
},
{
"text": "APP扫码登录的实现原理",
"link": "/column/ProblemNotes/日常笔记/APP扫码登录的实现原理.md"
},
{
"text": "共享单车扫码开锁的技术剖析",
"link": "/column/ProblemNotes/日常笔记/共享单车扫码开锁的技术剖析.md"
},
{
"text": "CDN资源不会产生跨域问题",
"link": "/column/ProblemNotes/日常笔记/CDN资源不会产生跨域问题.md"
},
{
"text": "网站主题切换的原理与最佳实践",
"link": "/column/ProblemNotes/日常笔记/网站主题切换的原理与最佳实践.md"
},
{
"text": "顶部阅读进度条的方案实现",
"link": "/column/ProblemNotes/日常笔记/顶部阅读进度条的方案实现.md"
},
{
"text": "不依赖点击的MouseEvent事件触发机制",
"link": "/column/ProblemNotes/日常笔记/不依赖点击的MouseEvent事件触发机制.md"
},
{
"text": "移动端H5适配方案实践",
"link": "/column/ProblemNotes/日常笔记/移动端H5适配方案实践.md"
}
]
}
],
"/column/Poetry/": [
{
"text": "诗词相关",
"collapsed": false,
"items": [
{
"text": "词牌名",
"items": [
{
"text": "蝶恋花",
"link": "/column/Poetry/诗词相关/词牌名/蝶恋花.md"
},
{
"text": "浣溪沙",
"link": "/column/Poetry/诗词相关/词牌名/浣溪沙.md"
},
{
"text": "菩萨蛮",
"link": "/column/Poetry/诗词相关/词牌名/菩萨蛮.md"
},
{
"text": "临江仙",
"link": "/column/Poetry/诗词相关/词牌名/临江仙.md"
}
]
},
{
"text": "田园风光",
"link": "/column/Poetry/诗词相关/田园风光.md"
},
{
"text": "相思别离",
"link": "/column/Poetry/诗词相关/相思别离.md"
},
{
"text": "寓情于景",
"link": "/column/Poetry/诗词相关/寓情于景.md"
},
{
"text": "名句总结",
"link": "/column/Poetry/诗词相关/名句总结.md"
},
{
"text": "人性",
"link": "/column/Poetry/诗词相关/人性.md"
}
]
}
],
"/column/CommonSense/": [
{
"text": "生活常识",
"collapsed": false,
"items": [
{
"text": "廿四节气",
"link": "/column/CommonSense/生活常识/廿四节气.md"
},
{
"text": "开车技巧",
"link": "/column/CommonSense/生活常识/开车技巧.md"
},
{
"text": "汽车车险",
"link": "/column/CommonSense/生活常识/汽车车险.md"
},
{
"text": "园区停车系统总结",
"link": "/column/CommonSense/生活常识/园区停车系统总结.md"
},
{
"text": "为什么发票填了公司就能报销？",
"link": "/column/CommonSense/生活常识/为什么发票填了公司就能报销？.md"
},
{
"text": "个人所得税已缴税额详解",
"link": "/column/CommonSense/生活常识/个人所得税已缴税额详解.md"
}
]
}
]
},
"outline": {
"level": [
2,
6
],
"label": "本页目录"
},
"socialLinks": [
{
"icon": "github",
"link": "https://github.com/gouxinjie"
},
{
"icon": "gitee",
"link": "https://gitee.com/gou-xinjie"
}
],
"lastUpdatedText": "最近更新",
"lastUpdated": {
"text": "最后更新于",
"formatOptions": {
"dateStyle": "short",
"timeStyle": "medium"
}
},
"footer": {
"message": "我见青山多妩媚，料青山见我应如是",
"copyright": "Copyright © 2026-present gouxinjie"
},
"docFooter": {
"prev": "前一篇",
"next": "后一篇"
},
"search": {
"provider": "algolia",
"options": {
"appId": "VDXJP5CTIA",
"apiKey": "f0fc71dd05d2daf1a73e3765c484bee6",
"indexName": "gouxinjieio"
}
},
"returnToTopLabel": "回到顶部",
"sidebarMenuLabel": "菜单",
"darkModeSwitchLabel": "主题",
"lightModeSwitchTitle": "切换到浅色模式",
"darkModeSwitchTitle": "切换到深色模式"
}Page Data
{
"title": "Runtime API Examples",
"description": "",
"frontmatter": {
"outline": "deep"
},
"headers": [],
"relativePath": "api-examples.md",
"filePath": "api-examples.md",
"lastUpdated": 1756950424000
}Page Frontmatter
{
"outline": "deep"
}More
Check out the documentation for the full list of runtime APIs.