[{"data":1,"prerenderedAt":1756},["ShallowReactive",2],{"content-/guide/export-frameworks":3,"related-guide":1724},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"keywords":10,"schemaType":11,"author":12,"date":13,"image":14,"body":15,"_type":1718,"_id":1719,"_source":1720,"_file":1721,"_stem":1722,"_extension":1723},"/guide/export-frameworks","guide",false,"","多框架导出指南 - 导出为 Vue/React/HTML","学习如何将 HTMLPAGE 编辑器中创建的网页导出为 Vue、React、纯 HTML 等多种框架格式，实现无缝开发集成。","HTMLPAGE 导出, Vue 组件导出, React 组件导出, HTML 导出, 网页代码导出","HowTo","HTMLPAGE","2025-11-20","/content-images/guide/guide.jpg",{"type":16,"children":17,"toc":1700},"root",[18,26,32,38,45,56,76,85,108,117,180,186,194,212,220,250,258,291,480,486,494,512,520,557,565,615,795,800,805,813,854,862,880,888,906,911,920,1001,1009,1219,1228,1388,1393,1398,1403,1443,1448,1453,1476,1481,1486,1509,1514,1522,1527,1545,1553,1558,1592,1600,1605,1628,1633,1673,1677,1694],{"type":19,"tag":20,"props":21,"children":23},"element","h1",{"id":22},"多框架导出指南",[24],{"type":25,"value":22},"text",{"type":19,"tag":27,"props":28,"children":29},"p",{},[30],{"type":25,"value":31},"HTMLPAGE 支持将你创建的网页导出为多种主流前端框架格式，让你可以轻松集成到现有项目中。",{"type":19,"tag":33,"props":34,"children":36},"h2",{"id":35},"支持的导出格式",[37],{"type":25,"value":35},{"type":19,"tag":39,"props":40,"children":42},"h3",{"id":41},"_1-纯-html-导出",[43],{"type":25,"value":44},"1. 纯 HTML 导出",{"type":19,"tag":27,"props":46,"children":47},{},[48,54],{"type":19,"tag":49,"props":50,"children":51},"strong",{},[52],{"type":25,"value":53},"适用场景",{"type":25,"value":55},"：",{"type":19,"tag":57,"props":58,"children":59},"ul",{},[60,66,71],{"type":19,"tag":61,"props":62,"children":63},"li",{},[64],{"type":25,"value":65},"静态网站部署",{"type":19,"tag":61,"props":67,"children":68},{},[69],{"type":25,"value":70},"快速原型展示",{"type":19,"tag":61,"props":72,"children":73},{},[74],{"type":25,"value":75},"独立落地页",{"type":19,"tag":27,"props":77,"children":78},{},[79,84],{"type":19,"tag":49,"props":80,"children":81},{},[82],{"type":25,"value":83},"导出内容",{"type":25,"value":55},{"type":19,"tag":57,"props":86,"children":87},{},[88,93,98,103],{"type":19,"tag":61,"props":89,"children":90},{},[91],{"type":25,"value":92},"完整的 HTML 文件",{"type":19,"tag":61,"props":94,"children":95},{},[96],{"type":25,"value":97},"内联或外部 CSS 样式",{"type":19,"tag":61,"props":99,"children":100},{},[101],{"type":25,"value":102},"响应式布局代码",{"type":19,"tag":61,"props":104,"children":105},{},[106],{"type":25,"value":107},"SEO 元标签",{"type":19,"tag":27,"props":109,"children":110},{},[111,116],{"type":19,"tag":49,"props":112,"children":113},{},[114],{"type":25,"value":115},"操作步骤",{"type":25,"value":55},{"type":19,"tag":118,"props":119,"children":120},"ol",{},[121,133,145,168],{"type":19,"tag":61,"props":122,"children":123},{},[124,126,131],{"type":25,"value":125},"点击顶部工具栏的 ",{"type":19,"tag":49,"props":127,"children":128},{},[129],{"type":25,"value":130},"\"导出\"",{"type":25,"value":132}," 按钮",{"type":19,"tag":61,"props":134,"children":135},{},[136,138,143],{"type":25,"value":137},"选择 ",{"type":19,"tag":49,"props":139,"children":140},{},[141],{"type":25,"value":142},"\"HTML\"",{"type":25,"value":144}," 格式",{"type":19,"tag":61,"props":146,"children":147},{},[148,150],{"type":25,"value":149},"配置导出选项：\n",{"type":19,"tag":57,"props":151,"children":152},{},[153,158,163],{"type":19,"tag":61,"props":154,"children":155},{},[156],{"type":25,"value":157},"CSS 内联/外部文件",{"type":19,"tag":61,"props":159,"children":160},{},[161],{"type":25,"value":162},"是否包含注释",{"type":19,"tag":61,"props":164,"children":165},{},[166],{"type":25,"value":167},"代码压缩选项",{"type":19,"tag":61,"props":169,"children":170},{},[171,173,178],{"type":25,"value":172},"点击 ",{"type":19,"tag":49,"props":174,"children":175},{},[176],{"type":25,"value":177},"\"下载\"",{"type":25,"value":179}," 获取 ZIP 文件",{"type":19,"tag":39,"props":181,"children":183},{"id":182},"_2-vue-3-组件导出",[184],{"type":25,"value":185},"2. Vue 3 组件导出",{"type":19,"tag":27,"props":187,"children":188},{},[189,193],{"type":19,"tag":49,"props":190,"children":191},{},[192],{"type":25,"value":53},{"type":25,"value":55},{"type":19,"tag":57,"props":195,"children":196},{},[197,202,207],{"type":19,"tag":61,"props":198,"children":199},{},[200],{"type":25,"value":201},"Vue 3 项目集成",{"type":19,"tag":61,"props":203,"children":204},{},[205],{"type":25,"value":206},"Nuxt 应用开发",{"type":19,"tag":61,"props":208,"children":209},{},[210],{"type":25,"value":211},"组件库构建",{"type":19,"tag":27,"props":213,"children":214},{},[215,219],{"type":19,"tag":49,"props":216,"children":217},{},[218],{"type":25,"value":83},{"type":25,"value":55},{"type":19,"tag":57,"props":221,"children":222},{},[223,235,240,245],{"type":19,"tag":61,"props":224,"children":225},{},[226,233],{"type":19,"tag":227,"props":228,"children":230},"code",{"className":229},[],[231],{"type":25,"value":232},".vue",{"type":25,"value":234}," 单文件组件",{"type":19,"tag":61,"props":236,"children":237},{},[238],{"type":25,"value":239},"TailwindCSS/Bootstrap 样式引用",{"type":19,"tag":61,"props":241,"children":242},{},[243],{"type":25,"value":244},"响应式数据绑定准备",{"type":19,"tag":61,"props":246,"children":247},{},[248],{"type":25,"value":249},"组件化结构",{"type":19,"tag":27,"props":251,"children":252},{},[253,257],{"type":19,"tag":49,"props":254,"children":255},{},[256],{"type":25,"value":115},{"type":25,"value":55},{"type":19,"tag":118,"props":259,"children":260},{},[261,276,281,286],{"type":19,"tag":61,"props":262,"children":263},{},[264,265,269,271],{"type":25,"value":137},{"type":19,"tag":49,"props":266,"children":267},{},[268],{"type":25,"value":130},{"type":25,"value":270}," → ",{"type":19,"tag":49,"props":272,"children":273},{},[274],{"type":25,"value":275},"\"Vue 3\"",{"type":19,"tag":61,"props":277,"children":278},{},[279],{"type":25,"value":280},"设置组件名称（推荐使用 PascalCase）",{"type":19,"tag":61,"props":282,"children":283},{},[284],{"type":25,"value":285},"选择 CSS 框架（TailwindCSS/Bootstrap）",{"type":19,"tag":61,"props":287,"children":288},{},[289],{"type":25,"value":290},"导出并集成到项目：",{"type":19,"tag":292,"props":293,"children":297},"pre",{"className":294,"code":295,"language":296,"meta":7,"style":7},"language-bash shiki shiki-themes github-dark github-dark","# 复制到 Vue 项目\ncp LandingPage.vue ~/my-vue-project/src/components/\n\n# 在页面中使用\n\u003Ctemplate>\n  \u003CLandingPage />\n\u003C/template>\n\n\u003Cscript setup>\nimport LandingPage from '@/components/LandingPage.vue'\n\u003C/script>\n","bash",[298],{"type":19,"tag":227,"props":299,"children":300},{"__ignoreMap":7},[301,313,334,344,353,374,397,414,422,439,463],{"type":19,"tag":302,"props":303,"children":306},"span",{"class":304,"line":305},"line",1,[307],{"type":19,"tag":302,"props":308,"children":310},{"style":309},"--shiki-default:#6A737D;--shiki-dark:#6A737D",[311],{"type":25,"value":312},"# 复制到 Vue 项目\n",{"type":19,"tag":302,"props":314,"children":316},{"class":304,"line":315},2,[317,323,329],{"type":19,"tag":302,"props":318,"children":320},{"style":319},"--shiki-default:#B392F0;--shiki-dark:#B392F0",[321],{"type":25,"value":322},"cp",{"type":19,"tag":302,"props":324,"children":326},{"style":325},"--shiki-default:#9ECBFF;--shiki-dark:#9ECBFF",[327],{"type":25,"value":328}," LandingPage.vue",{"type":19,"tag":302,"props":330,"children":331},{"style":325},[332],{"type":25,"value":333}," ~/my-vue-project/src/components/\n",{"type":19,"tag":302,"props":335,"children":337},{"class":304,"line":336},3,[338],{"type":19,"tag":302,"props":339,"children":341},{"emptyLinePlaceholder":340},true,[342],{"type":25,"value":343},"\n",{"type":19,"tag":302,"props":345,"children":347},{"class":304,"line":346},4,[348],{"type":19,"tag":302,"props":349,"children":350},{"style":309},[351],{"type":25,"value":352},"# 在页面中使用\n",{"type":19,"tag":302,"props":354,"children":356},{"class":304,"line":355},5,[357,363,369],{"type":19,"tag":302,"props":358,"children":360},{"style":359},"--shiki-default:#F97583;--shiki-dark:#F97583",[361],{"type":25,"value":362},"\u003C",{"type":19,"tag":302,"props":364,"children":366},{"style":365},"--shiki-default:#E1E4E8;--shiki-dark:#E1E4E8",[367],{"type":25,"value":368},"template",{"type":19,"tag":302,"props":370,"children":371},{"style":359},[372],{"type":25,"value":373},">\n",{"type":19,"tag":302,"props":375,"children":377},{"class":304,"line":376},6,[378,383,388,393],{"type":19,"tag":302,"props":379,"children":380},{"style":359},[381],{"type":25,"value":382},"  \u003C",{"type":19,"tag":302,"props":384,"children":385},{"style":319},[386],{"type":25,"value":387},"LandingPage",{"type":19,"tag":302,"props":389,"children":390},{"style":365},[391],{"type":25,"value":392}," /",{"type":19,"tag":302,"props":394,"children":395},{"style":359},[396],{"type":25,"value":373},{"type":19,"tag":302,"props":398,"children":400},{"class":304,"line":399},7,[401,405,410],{"type":19,"tag":302,"props":402,"children":403},{"style":359},[404],{"type":25,"value":362},{"type":19,"tag":302,"props":406,"children":407},{"style":365},[408],{"type":25,"value":409},"/template",{"type":19,"tag":302,"props":411,"children":412},{"style":359},[413],{"type":25,"value":373},{"type":19,"tag":302,"props":415,"children":417},{"class":304,"line":416},8,[418],{"type":19,"tag":302,"props":419,"children":420},{"emptyLinePlaceholder":340},[421],{"type":25,"value":343},{"type":19,"tag":302,"props":423,"children":425},{"class":304,"line":424},9,[426,430,435],{"type":19,"tag":302,"props":427,"children":428},{"style":359},[429],{"type":25,"value":362},{"type":19,"tag":302,"props":431,"children":432},{"style":365},[433],{"type":25,"value":434},"script setup",{"type":19,"tag":302,"props":436,"children":437},{"style":359},[438],{"type":25,"value":373},{"type":19,"tag":302,"props":440,"children":442},{"class":304,"line":441},10,[443,448,453,458],{"type":19,"tag":302,"props":444,"children":445},{"style":319},[446],{"type":25,"value":447},"import",{"type":19,"tag":302,"props":449,"children":450},{"style":325},[451],{"type":25,"value":452}," LandingPage",{"type":19,"tag":302,"props":454,"children":455},{"style":325},[456],{"type":25,"value":457}," from",{"type":19,"tag":302,"props":459,"children":460},{"style":325},[461],{"type":25,"value":462}," '@/components/LandingPage.vue'\n",{"type":19,"tag":302,"props":464,"children":466},{"class":304,"line":465},11,[467,471,476],{"type":19,"tag":302,"props":468,"children":469},{"style":359},[470],{"type":25,"value":362},{"type":19,"tag":302,"props":472,"children":473},{"style":365},[474],{"type":25,"value":475},"/script",{"type":19,"tag":302,"props":477,"children":478},{"style":359},[479],{"type":25,"value":373},{"type":19,"tag":39,"props":481,"children":483},{"id":482},"_3-react-组件导出",[484],{"type":25,"value":485},"3. React 组件导出",{"type":19,"tag":27,"props":487,"children":488},{},[489,493],{"type":19,"tag":49,"props":490,"children":491},{},[492],{"type":25,"value":53},{"type":25,"value":55},{"type":19,"tag":57,"props":495,"children":496},{},[497,502,507],{"type":19,"tag":61,"props":498,"children":499},{},[500],{"type":25,"value":501},"React 项目集成",{"type":19,"tag":61,"props":503,"children":504},{},[505],{"type":25,"value":506},"Next.js 应用开发",{"type":19,"tag":61,"props":508,"children":509},{},[510],{"type":25,"value":511},"TypeScript 项目",{"type":19,"tag":27,"props":513,"children":514},{},[515,519],{"type":19,"tag":49,"props":516,"children":517},{},[518],{"type":25,"value":83},{"type":25,"value":55},{"type":19,"tag":57,"props":521,"children":522},{},[523,542,547,552],{"type":19,"tag":61,"props":524,"children":525},{},[526,532,534,540],{"type":19,"tag":227,"props":527,"children":529},{"className":528},[],[530],{"type":25,"value":531},".jsx",{"type":25,"value":533}," 或 ",{"type":19,"tag":227,"props":535,"children":537},{"className":536},[],[538],{"type":25,"value":539},".tsx",{"type":25,"value":541}," 组件文件",{"type":19,"tag":61,"props":543,"children":544},{},[545],{"type":25,"value":546},"函数式组件（Hooks 风格）",{"type":19,"tag":61,"props":548,"children":549},{},[550],{"type":25,"value":551},"CSS Modules/Styled Components 支持",{"type":19,"tag":61,"props":553,"children":554},{},[555],{"type":25,"value":556},"TypeScript 类型定义（可选）",{"type":19,"tag":27,"props":558,"children":559},{},[560,564],{"type":19,"tag":49,"props":561,"children":562},{},[563],{"type":25,"value":115},{"type":25,"value":55},{"type":19,"tag":118,"props":566,"children":567},{},[568,582,587,610],{"type":19,"tag":61,"props":569,"children":570},{},[571,572,576,577],{"type":25,"value":137},{"type":19,"tag":49,"props":573,"children":574},{},[575],{"type":25,"value":130},{"type":25,"value":270},{"type":19,"tag":49,"props":578,"children":579},{},[580],{"type":25,"value":581},"\"React\"",{"type":19,"tag":61,"props":583,"children":584},{},[585],{"type":25,"value":586},"选择语言：JavaScript 或 TypeScript",{"type":19,"tag":61,"props":588,"children":589},{},[590,592],{"type":25,"value":591},"选择样式方案：\n",{"type":19,"tag":57,"props":593,"children":594},{},[595,600,605],{"type":19,"tag":61,"props":596,"children":597},{},[598],{"type":25,"value":599},"CSS Modules",{"type":19,"tag":61,"props":601,"children":602},{},[603],{"type":25,"value":604},"Styled Components",{"type":19,"tag":61,"props":606,"children":607},{},[608],{"type":25,"value":609},"TailwindCSS",{"type":19,"tag":61,"props":611,"children":612},{},[613],{"type":25,"value":614},"导出组件：",{"type":19,"tag":292,"props":616,"children":620},{"className":617,"code":618,"language":619,"meta":7,"style":7},"language-jsx shiki shiki-themes github-dark github-dark","// LandingPage.jsx\nimport React from 'react'\nimport './LandingPage.module.css'\n\nexport default function LandingPage() {\n  return (\n    \u003Cdiv className=\"landing-page\">\n      {/* 生成的结构 */}\n    \u003C/div>\n  )\n}\n","jsx",[621],{"type":19,"tag":227,"props":622,"children":623},{"__ignoreMap":7},[624,632,654,666,673,700,713,746,764,780,788],{"type":19,"tag":302,"props":625,"children":626},{"class":304,"line":305},[627],{"type":19,"tag":302,"props":628,"children":629},{"style":309},[630],{"type":25,"value":631},"// LandingPage.jsx\n",{"type":19,"tag":302,"props":633,"children":634},{"class":304,"line":315},[635,639,644,649],{"type":19,"tag":302,"props":636,"children":637},{"style":359},[638],{"type":25,"value":447},{"type":19,"tag":302,"props":640,"children":641},{"style":365},[642],{"type":25,"value":643}," React ",{"type":19,"tag":302,"props":645,"children":646},{"style":359},[647],{"type":25,"value":648},"from",{"type":19,"tag":302,"props":650,"children":651},{"style":325},[652],{"type":25,"value":653}," 'react'\n",{"type":19,"tag":302,"props":655,"children":656},{"class":304,"line":336},[657,661],{"type":19,"tag":302,"props":658,"children":659},{"style":359},[660],{"type":25,"value":447},{"type":19,"tag":302,"props":662,"children":663},{"style":325},[664],{"type":25,"value":665}," './LandingPage.module.css'\n",{"type":19,"tag":302,"props":667,"children":668},{"class":304,"line":346},[669],{"type":19,"tag":302,"props":670,"children":671},{"emptyLinePlaceholder":340},[672],{"type":25,"value":343},{"type":19,"tag":302,"props":674,"children":675},{"class":304,"line":355},[676,681,686,691,695],{"type":19,"tag":302,"props":677,"children":678},{"style":359},[679],{"type":25,"value":680},"export",{"type":19,"tag":302,"props":682,"children":683},{"style":359},[684],{"type":25,"value":685}," default",{"type":19,"tag":302,"props":687,"children":688},{"style":359},[689],{"type":25,"value":690}," function",{"type":19,"tag":302,"props":692,"children":693},{"style":319},[694],{"type":25,"value":452},{"type":19,"tag":302,"props":696,"children":697},{"style":365},[698],{"type":25,"value":699},"() {\n",{"type":19,"tag":302,"props":701,"children":702},{"class":304,"line":376},[703,708],{"type":19,"tag":302,"props":704,"children":705},{"style":359},[706],{"type":25,"value":707},"  return",{"type":19,"tag":302,"props":709,"children":710},{"style":365},[711],{"type":25,"value":712}," (\n",{"type":19,"tag":302,"props":714,"children":715},{"class":304,"line":399},[716,721,727,732,737,742],{"type":19,"tag":302,"props":717,"children":718},{"style":365},[719],{"type":25,"value":720},"    \u003C",{"type":19,"tag":302,"props":722,"children":724},{"style":723},"--shiki-default:#85E89D;--shiki-dark:#85E89D",[725],{"type":25,"value":726},"div",{"type":19,"tag":302,"props":728,"children":729},{"style":319},[730],{"type":25,"value":731}," className",{"type":19,"tag":302,"props":733,"children":734},{"style":359},[735],{"type":25,"value":736},"=",{"type":19,"tag":302,"props":738,"children":739},{"style":325},[740],{"type":25,"value":741},"\"landing-page\"",{"type":19,"tag":302,"props":743,"children":744},{"style":365},[745],{"type":25,"value":373},{"type":19,"tag":302,"props":747,"children":748},{"class":304,"line":416},[749,754,759],{"type":19,"tag":302,"props":750,"children":751},{"style":365},[752],{"type":25,"value":753},"      {",{"type":19,"tag":302,"props":755,"children":756},{"style":309},[757],{"type":25,"value":758},"/* 生成的结构 */",{"type":19,"tag":302,"props":760,"children":761},{"style":365},[762],{"type":25,"value":763},"}\n",{"type":19,"tag":302,"props":765,"children":766},{"class":304,"line":424},[767,772,776],{"type":19,"tag":302,"props":768,"children":769},{"style":365},[770],{"type":25,"value":771},"    \u003C/",{"type":19,"tag":302,"props":773,"children":774},{"style":723},[775],{"type":25,"value":726},{"type":19,"tag":302,"props":777,"children":778},{"style":365},[779],{"type":25,"value":373},{"type":19,"tag":302,"props":781,"children":782},{"class":304,"line":441},[783],{"type":19,"tag":302,"props":784,"children":785},{"style":365},[786],{"type":25,"value":787},"  )\n",{"type":19,"tag":302,"props":789,"children":790},{"class":304,"line":465},[791],{"type":19,"tag":302,"props":792,"children":793},{"style":365},[794],{"type":25,"value":763},{"type":19,"tag":33,"props":796,"children":798},{"id":797},"导出最佳实践",[799],{"type":25,"value":797},{"type":19,"tag":39,"props":801,"children":803},{"id":802},"代码质量优化",[804],{"type":25,"value":802},{"type":19,"tag":27,"props":806,"children":807},{},[808],{"type":19,"tag":49,"props":809,"children":810},{},[811],{"type":25,"value":812},"1. 语义化 HTML",{"type":19,"tag":57,"props":814,"children":815},{},[816,844,849],{"type":19,"tag":61,"props":817,"children":818},{},[819,821,827,829,835,836,842],{"type":25,"value":820},"使用正确的标签（",{"type":19,"tag":227,"props":822,"children":824},{"className":823},[],[825],{"type":25,"value":826},"\u003Cheader>",{"type":25,"value":828},", ",{"type":19,"tag":227,"props":830,"children":832},{"className":831},[],[833],{"type":25,"value":834},"\u003Cnav>",{"type":25,"value":828},{"type":19,"tag":227,"props":837,"children":839},{"className":838},[],[840],{"type":25,"value":841},"\u003Csection>",{"type":25,"value":843},"）",{"type":19,"tag":61,"props":845,"children":846},{},[847],{"type":25,"value":848},"确保 Heading 层级正确（H1 → H2 → H3）",{"type":19,"tag":61,"props":850,"children":851},{},[852],{"type":25,"value":853},"添加 ARIA 标签提升可访问性",{"type":19,"tag":27,"props":855,"children":856},{},[857],{"type":19,"tag":49,"props":858,"children":859},{},[860],{"type":25,"value":861},"2. CSS 优化",{"type":19,"tag":57,"props":863,"children":864},{},[865,870,875],{"type":19,"tag":61,"props":866,"children":867},{},[868],{"type":25,"value":869},"移除未使用的样式类",{"type":19,"tag":61,"props":871,"children":872},{},[873],{"type":25,"value":874},"合并重复的样式规则",{"type":19,"tag":61,"props":876,"children":877},{},[878],{"type":25,"value":879},"使用 CSS 变量管理主题色",{"type":19,"tag":27,"props":881,"children":882},{},[883],{"type":19,"tag":49,"props":884,"children":885},{},[886],{"type":25,"value":887},"3. 响应式检查",{"type":19,"tag":57,"props":889,"children":890},{},[891,896,901],{"type":19,"tag":61,"props":892,"children":893},{},[894],{"type":25,"value":895},"测试桌面/平板/手机三种尺寸",{"type":19,"tag":61,"props":897,"children":898},{},[899],{"type":25,"value":900},"确认断点设置合理",{"type":19,"tag":61,"props":902,"children":903},{},[904],{"type":25,"value":905},"检查图片自适应",{"type":19,"tag":39,"props":907,"children":909},{"id":908},"集成到项目",[910],{"type":25,"value":908},{"type":19,"tag":27,"props":912,"children":913},{},[914,919],{"type":19,"tag":49,"props":915,"children":916},{},[917],{"type":25,"value":918},"静态部署（HTML）",{"type":25,"value":55},{"type":19,"tag":292,"props":921,"children":923},{"className":294,"code":922,"language":296,"meta":7,"style":7},"# 解压导出的 ZIP 文件\nunzip landing-page.zip -d ./dist\n\n# 部署到 Nginx/Apache\ncp -r ./dist/* /var/www/html/\n",[924],{"type":19,"tag":227,"props":925,"children":926},{"__ignoreMap":7},[927,935,959,966,974],{"type":19,"tag":302,"props":928,"children":929},{"class":304,"line":305},[930],{"type":19,"tag":302,"props":931,"children":932},{"style":309},[933],{"type":25,"value":934},"# 解压导出的 ZIP 文件\n",{"type":19,"tag":302,"props":936,"children":937},{"class":304,"line":315},[938,943,948,954],{"type":19,"tag":302,"props":939,"children":940},{"style":319},[941],{"type":25,"value":942},"unzip",{"type":19,"tag":302,"props":944,"children":945},{"style":325},[946],{"type":25,"value":947}," landing-page.zip",{"type":19,"tag":302,"props":949,"children":951},{"style":950},"--shiki-default:#79B8FF;--shiki-dark:#79B8FF",[952],{"type":25,"value":953}," -d",{"type":19,"tag":302,"props":955,"children":956},{"style":325},[957],{"type":25,"value":958}," ./dist\n",{"type":19,"tag":302,"props":960,"children":961},{"class":304,"line":336},[962],{"type":19,"tag":302,"props":963,"children":964},{"emptyLinePlaceholder":340},[965],{"type":25,"value":343},{"type":19,"tag":302,"props":967,"children":968},{"class":304,"line":346},[969],{"type":19,"tag":302,"props":970,"children":971},{"style":309},[972],{"type":25,"value":973},"# 部署到 Nginx/Apache\n",{"type":19,"tag":302,"props":975,"children":976},{"class":304,"line":355},[977,981,986,991,996],{"type":19,"tag":302,"props":978,"children":979},{"style":319},[980],{"type":25,"value":322},{"type":19,"tag":302,"props":982,"children":983},{"style":950},[984],{"type":25,"value":985}," -r",{"type":19,"tag":302,"props":987,"children":988},{"style":325},[989],{"type":25,"value":990}," ./dist/",{"type":19,"tag":302,"props":992,"children":993},{"style":950},[994],{"type":25,"value":995},"*",{"type":19,"tag":302,"props":997,"children":998},{"style":325},[999],{"type":25,"value":1000}," /var/www/html/\n",{"type":19,"tag":27,"props":1002,"children":1003},{},[1004,1008],{"type":19,"tag":49,"props":1005,"children":1006},{},[1007],{"type":25,"value":201},{"type":25,"value":55},{"type":19,"tag":292,"props":1010,"children":1014},{"className":1011,"code":1012,"language":1013,"meta":7,"style":7},"language-vue shiki shiki-themes github-dark github-dark","\u003C!-- pages/landing.vue -->\n\u003Cscript setup>\nimport { useSeoMeta } from '@unhead/vue'\nimport LandingPage from '@/components/LandingPage.vue'\n\nuseSeoMeta({\n  title: '产品落地页',\n  description: '我们的产品介绍'\n})\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CLandingPage />\n\u003C/template>\n","vue",[1015],{"type":19,"tag":227,"props":1016,"children":1017},{"__ignoreMap":7},[1018,1026,1047,1068,1088,1095,1108,1126,1139,1147,1163,1170,1186,1203],{"type":19,"tag":302,"props":1019,"children":1020},{"class":304,"line":305},[1021],{"type":19,"tag":302,"props":1022,"children":1023},{"style":309},[1024],{"type":25,"value":1025},"\u003C!-- pages/landing.vue -->\n",{"type":19,"tag":302,"props":1027,"children":1028},{"class":304,"line":315},[1029,1033,1038,1043],{"type":19,"tag":302,"props":1030,"children":1031},{"style":365},[1032],{"type":25,"value":362},{"type":19,"tag":302,"props":1034,"children":1035},{"style":723},[1036],{"type":25,"value":1037},"script",{"type":19,"tag":302,"props":1039,"children":1040},{"style":319},[1041],{"type":25,"value":1042}," setup",{"type":19,"tag":302,"props":1044,"children":1045},{"style":365},[1046],{"type":25,"value":373},{"type":19,"tag":302,"props":1048,"children":1049},{"class":304,"line":336},[1050,1054,1059,1063],{"type":19,"tag":302,"props":1051,"children":1052},{"style":359},[1053],{"type":25,"value":447},{"type":19,"tag":302,"props":1055,"children":1056},{"style":365},[1057],{"type":25,"value":1058}," { useSeoMeta } ",{"type":19,"tag":302,"props":1060,"children":1061},{"style":359},[1062],{"type":25,"value":648},{"type":19,"tag":302,"props":1064,"children":1065},{"style":325},[1066],{"type":25,"value":1067}," '@unhead/vue'\n",{"type":19,"tag":302,"props":1069,"children":1070},{"class":304,"line":346},[1071,1075,1080,1084],{"type":19,"tag":302,"props":1072,"children":1073},{"style":359},[1074],{"type":25,"value":447},{"type":19,"tag":302,"props":1076,"children":1077},{"style":365},[1078],{"type":25,"value":1079}," LandingPage ",{"type":19,"tag":302,"props":1081,"children":1082},{"style":359},[1083],{"type":25,"value":648},{"type":19,"tag":302,"props":1085,"children":1086},{"style":325},[1087],{"type":25,"value":462},{"type":19,"tag":302,"props":1089,"children":1090},{"class":304,"line":355},[1091],{"type":19,"tag":302,"props":1092,"children":1093},{"emptyLinePlaceholder":340},[1094],{"type":25,"value":343},{"type":19,"tag":302,"props":1096,"children":1097},{"class":304,"line":376},[1098,1103],{"type":19,"tag":302,"props":1099,"children":1100},{"style":319},[1101],{"type":25,"value":1102},"useSeoMeta",{"type":19,"tag":302,"props":1104,"children":1105},{"style":365},[1106],{"type":25,"value":1107},"({\n",{"type":19,"tag":302,"props":1109,"children":1110},{"class":304,"line":399},[1111,1116,1121],{"type":19,"tag":302,"props":1112,"children":1113},{"style":365},[1114],{"type":25,"value":1115},"  title: ",{"type":19,"tag":302,"props":1117,"children":1118},{"style":325},[1119],{"type":25,"value":1120},"'产品落地页'",{"type":19,"tag":302,"props":1122,"children":1123},{"style":365},[1124],{"type":25,"value":1125},",\n",{"type":19,"tag":302,"props":1127,"children":1128},{"class":304,"line":416},[1129,1134],{"type":19,"tag":302,"props":1130,"children":1131},{"style":365},[1132],{"type":25,"value":1133},"  description: ",{"type":19,"tag":302,"props":1135,"children":1136},{"style":325},[1137],{"type":25,"value":1138},"'我们的产品介绍'\n",{"type":19,"tag":302,"props":1140,"children":1141},{"class":304,"line":424},[1142],{"type":19,"tag":302,"props":1143,"children":1144},{"style":365},[1145],{"type":25,"value":1146},"})\n",{"type":19,"tag":302,"props":1148,"children":1149},{"class":304,"line":441},[1150,1155,1159],{"type":19,"tag":302,"props":1151,"children":1152},{"style":365},[1153],{"type":25,"value":1154},"\u003C/",{"type":19,"tag":302,"props":1156,"children":1157},{"style":723},[1158],{"type":25,"value":1037},{"type":19,"tag":302,"props":1160,"children":1161},{"style":365},[1162],{"type":25,"value":373},{"type":19,"tag":302,"props":1164,"children":1165},{"class":304,"line":465},[1166],{"type":19,"tag":302,"props":1167,"children":1168},{"emptyLinePlaceholder":340},[1169],{"type":25,"value":343},{"type":19,"tag":302,"props":1171,"children":1173},{"class":304,"line":1172},12,[1174,1178,1182],{"type":19,"tag":302,"props":1175,"children":1176},{"style":365},[1177],{"type":25,"value":362},{"type":19,"tag":302,"props":1179,"children":1180},{"style":723},[1181],{"type":25,"value":368},{"type":19,"tag":302,"props":1183,"children":1184},{"style":365},[1185],{"type":25,"value":373},{"type":19,"tag":302,"props":1187,"children":1189},{"class":304,"line":1188},13,[1190,1194,1198],{"type":19,"tag":302,"props":1191,"children":1192},{"style":365},[1193],{"type":25,"value":382},{"type":19,"tag":302,"props":1195,"children":1196},{"style":723},[1197],{"type":25,"value":387},{"type":19,"tag":302,"props":1199,"children":1200},{"style":365},[1201],{"type":25,"value":1202}," />\n",{"type":19,"tag":302,"props":1204,"children":1206},{"class":304,"line":1205},14,[1207,1211,1215],{"type":19,"tag":302,"props":1208,"children":1209},{"style":365},[1210],{"type":25,"value":1154},{"type":19,"tag":302,"props":1212,"children":1213},{"style":723},[1214],{"type":25,"value":368},{"type":19,"tag":302,"props":1216,"children":1217},{"style":365},[1218],{"type":25,"value":373},{"type":19,"tag":27,"props":1220,"children":1221},{},[1222,1227],{"type":19,"tag":49,"props":1223,"children":1224},{},[1225],{"type":25,"value":1226},"React/Next.js 集成",{"type":25,"value":55},{"type":19,"tag":292,"props":1229,"children":1231},{"className":617,"code":1230,"language":619,"meta":7,"style":7},"// app/landing/page.jsx\nimport LandingPage from '@/components/LandingPage'\n\nexport const metadata = {\n  title: '产品落地页',\n  description: '我们的产品介绍'\n}\n\nexport default function LandingRoute() {\n  return \u003CLandingPage />\n}\n",[1232],{"type":19,"tag":227,"props":1233,"children":1234},{"__ignoreMap":7},[1235,1243,1263,1270,1297,1312,1323,1330,1337,1361,1381],{"type":19,"tag":302,"props":1236,"children":1237},{"class":304,"line":305},[1238],{"type":19,"tag":302,"props":1239,"children":1240},{"style":309},[1241],{"type":25,"value":1242},"// app/landing/page.jsx\n",{"type":19,"tag":302,"props":1244,"children":1245},{"class":304,"line":315},[1246,1250,1254,1258],{"type":19,"tag":302,"props":1247,"children":1248},{"style":359},[1249],{"type":25,"value":447},{"type":19,"tag":302,"props":1251,"children":1252},{"style":365},[1253],{"type":25,"value":1079},{"type":19,"tag":302,"props":1255,"children":1256},{"style":359},[1257],{"type":25,"value":648},{"type":19,"tag":302,"props":1259,"children":1260},{"style":325},[1261],{"type":25,"value":1262}," '@/components/LandingPage'\n",{"type":19,"tag":302,"props":1264,"children":1265},{"class":304,"line":336},[1266],{"type":19,"tag":302,"props":1267,"children":1268},{"emptyLinePlaceholder":340},[1269],{"type":25,"value":343},{"type":19,"tag":302,"props":1271,"children":1272},{"class":304,"line":346},[1273,1277,1282,1287,1292],{"type":19,"tag":302,"props":1274,"children":1275},{"style":359},[1276],{"type":25,"value":680},{"type":19,"tag":302,"props":1278,"children":1279},{"style":359},[1280],{"type":25,"value":1281}," const",{"type":19,"tag":302,"props":1283,"children":1284},{"style":950},[1285],{"type":25,"value":1286}," metadata",{"type":19,"tag":302,"props":1288,"children":1289},{"style":359},[1290],{"type":25,"value":1291}," =",{"type":19,"tag":302,"props":1293,"children":1294},{"style":365},[1295],{"type":25,"value":1296}," {\n",{"type":19,"tag":302,"props":1298,"children":1299},{"class":304,"line":355},[1300,1304,1308],{"type":19,"tag":302,"props":1301,"children":1302},{"style":365},[1303],{"type":25,"value":1115},{"type":19,"tag":302,"props":1305,"children":1306},{"style":325},[1307],{"type":25,"value":1120},{"type":19,"tag":302,"props":1309,"children":1310},{"style":365},[1311],{"type":25,"value":1125},{"type":19,"tag":302,"props":1313,"children":1314},{"class":304,"line":376},[1315,1319],{"type":19,"tag":302,"props":1316,"children":1317},{"style":365},[1318],{"type":25,"value":1133},{"type":19,"tag":302,"props":1320,"children":1321},{"style":325},[1322],{"type":25,"value":1138},{"type":19,"tag":302,"props":1324,"children":1325},{"class":304,"line":399},[1326],{"type":19,"tag":302,"props":1327,"children":1328},{"style":365},[1329],{"type":25,"value":763},{"type":19,"tag":302,"props":1331,"children":1332},{"class":304,"line":416},[1333],{"type":19,"tag":302,"props":1334,"children":1335},{"emptyLinePlaceholder":340},[1336],{"type":25,"value":343},{"type":19,"tag":302,"props":1338,"children":1339},{"class":304,"line":424},[1340,1344,1348,1352,1357],{"type":19,"tag":302,"props":1341,"children":1342},{"style":359},[1343],{"type":25,"value":680},{"type":19,"tag":302,"props":1345,"children":1346},{"style":359},[1347],{"type":25,"value":685},{"type":19,"tag":302,"props":1349,"children":1350},{"style":359},[1351],{"type":25,"value":690},{"type":19,"tag":302,"props":1353,"children":1354},{"style":319},[1355],{"type":25,"value":1356}," LandingRoute",{"type":19,"tag":302,"props":1358,"children":1359},{"style":365},[1360],{"type":25,"value":699},{"type":19,"tag":302,"props":1362,"children":1363},{"class":304,"line":441},[1364,1368,1373,1377],{"type":19,"tag":302,"props":1365,"children":1366},{"style":359},[1367],{"type":25,"value":707},{"type":19,"tag":302,"props":1369,"children":1370},{"style":365},[1371],{"type":25,"value":1372}," \u003C",{"type":19,"tag":302,"props":1374,"children":1375},{"style":950},[1376],{"type":25,"value":387},{"type":19,"tag":302,"props":1378,"children":1379},{"style":365},[1380],{"type":25,"value":1202},{"type":19,"tag":302,"props":1382,"children":1383},{"class":304,"line":465},[1384],{"type":19,"tag":302,"props":1385,"children":1386},{"style":365},[1387],{"type":25,"value":763},{"type":19,"tag":33,"props":1389,"children":1391},{"id":1390},"高级功能",[1392],{"type":25,"value":1390},{"type":19,"tag":39,"props":1394,"children":1396},{"id":1395},"批量导出",[1397],{"type":25,"value":1395},{"type":19,"tag":27,"props":1399,"children":1400},{},[1401],{"type":25,"value":1402},"如果你有多个页面需要导出：",{"type":19,"tag":118,"props":1404,"children":1405},{},[1406,1418,1428,1433,1438],{"type":19,"tag":61,"props":1407,"children":1408},{},[1409,1411,1416],{"type":25,"value":1410},"在 ",{"type":19,"tag":49,"props":1412,"children":1413},{},[1414],{"type":25,"value":1415},"\"页面\"",{"type":25,"value":1417}," 面板查看所有页面",{"type":19,"tag":61,"props":1419,"children":1420},{},[1421,1422,1427],{"type":25,"value":172},{"type":19,"tag":49,"props":1423,"children":1424},{},[1425],{"type":25,"value":1426},"\"批量导出\"",{"type":25,"value":132},{"type":19,"tag":61,"props":1429,"children":1430},{},[1431],{"type":25,"value":1432},"选择需要导出的页面（支持多选）",{"type":19,"tag":61,"props":1434,"children":1435},{},[1436],{"type":25,"value":1437},"选择统一的导出格式",{"type":19,"tag":61,"props":1439,"children":1440},{},[1441],{"type":25,"value":1442},"下载包含所有页面的 ZIP 包",{"type":19,"tag":39,"props":1444,"children":1446},{"id":1445},"导出配置保存",[1447],{"type":25,"value":1445},{"type":19,"tag":27,"props":1449,"children":1450},{},[1451],{"type":25,"value":1452},"将常用的导出配置保存为预设：",{"type":19,"tag":118,"props":1454,"children":1455},{},[1456,1466,1471],{"type":19,"tag":61,"props":1457,"children":1458},{},[1459,1461],{"type":25,"value":1460},"配置好导出选项后点击 ",{"type":19,"tag":49,"props":1462,"children":1463},{},[1464],{"type":25,"value":1465},"\"保存预设\"",{"type":19,"tag":61,"props":1467,"children":1468},{},[1469],{"type":25,"value":1470},"命名你的配置（如 \"Vue3-TailwindCSS\"）",{"type":19,"tag":61,"props":1472,"children":1473},{},[1474],{"type":25,"value":1475},"下次导出时直接选择预设即可",{"type":19,"tag":39,"props":1477,"children":1479},{"id":1478},"代码片段导出",[1480],{"type":25,"value":1478},{"type":19,"tag":27,"props":1482,"children":1483},{},[1484],{"type":25,"value":1485},"只需要导出某个组件或区块：",{"type":19,"tag":118,"props":1487,"children":1488},{},[1489,1494,1504],{"type":19,"tag":61,"props":1490,"children":1491},{},[1492],{"type":25,"value":1493},"在画布中选中目标元素",{"type":19,"tag":61,"props":1495,"children":1496},{},[1497,1499],{"type":25,"value":1498},"右键菜单选择 ",{"type":19,"tag":49,"props":1500,"children":1501},{},[1502],{"type":25,"value":1503},"\"导出选中元素\"",{"type":19,"tag":61,"props":1505,"children":1506},{},[1507],{"type":25,"value":1508},"获取该部分的独立代码",{"type":19,"tag":33,"props":1510,"children":1512},{"id":1511},"常见问题",[1513],{"type":25,"value":1511},{"type":19,"tag":27,"props":1515,"children":1516},{},[1517],{"type":19,"tag":49,"props":1518,"children":1519},{},[1520],{"type":25,"value":1521},"Q: 导出的代码能直接使用吗？",{"type":19,"tag":27,"props":1523,"children":1524},{},[1525],{"type":25,"value":1526},"A: 大部分情况下可以直接使用。建议：",{"type":19,"tag":57,"props":1528,"children":1529},{},[1530,1535,1540],{"type":19,"tag":61,"props":1531,"children":1532},{},[1533],{"type":25,"value":1534},"检查依赖项是否已安装（TailwindCSS、图标库等）",{"type":19,"tag":61,"props":1536,"children":1537},{},[1538],{"type":25,"value":1539},"替换占位图片为实际资源",{"type":19,"tag":61,"props":1541,"children":1542},{},[1543],{"type":25,"value":1544},"调整颜色变量适配品牌",{"type":19,"tag":27,"props":1546,"children":1547},{},[1548],{"type":19,"tag":49,"props":1549,"children":1550},{},[1551],{"type":25,"value":1552},"Q: 如何处理动态数据？",{"type":19,"tag":27,"props":1554,"children":1555},{},[1556],{"type":25,"value":1557},"A: 导出的代码是静态结构，你需要：",{"type":19,"tag":57,"props":1559,"children":1560},{},[1561,1566,1587],{"type":19,"tag":61,"props":1562,"children":1563},{},[1564],{"type":25,"value":1565},"将硬编码文本替换为数据绑定",{"type":19,"tag":61,"props":1567,"children":1568},{},[1569,1571,1577,1579,1585],{"type":25,"value":1570},"添加 ",{"type":19,"tag":227,"props":1572,"children":1574},{"className":1573},[],[1575],{"type":25,"value":1576},"v-for",{"type":25,"value":1578},"（Vue）或 ",{"type":19,"tag":227,"props":1580,"children":1582},{"className":1581},[],[1583],{"type":25,"value":1584},".map()",{"type":25,"value":1586},"（React）实现列表渲染",{"type":19,"tag":61,"props":1588,"children":1589},{},[1590],{"type":25,"value":1591},"集成 API 调用获取动态内容",{"type":19,"tag":27,"props":1593,"children":1594},{},[1595],{"type":19,"tag":49,"props":1596,"children":1597},{},[1598],{"type":25,"value":1599},"Q: 导出的性能如何？",{"type":19,"tag":27,"props":1601,"children":1602},{},[1603],{"type":25,"value":1604},"A: HTMLPAGE 生成的代码经过优化：",{"type":19,"tag":57,"props":1606,"children":1607},{},[1608,1613,1618,1623],{"type":19,"tag":61,"props":1609,"children":1610},{},[1611],{"type":25,"value":1612},"使用现代 CSS（Flexbox/Grid）",{"type":19,"tag":61,"props":1614,"children":1615},{},[1616],{"type":25,"value":1617},"避免过度嵌套",{"type":19,"tag":61,"props":1619,"children":1620},{},[1621],{"type":25,"value":1622},"图片懒加载（可选）",{"type":19,"tag":61,"props":1624,"children":1625},{},[1626],{"type":25,"value":1627},"建议生产环境开启代码压缩",{"type":19,"tag":33,"props":1629,"children":1631},{"id":1630},"相关资源",[1632],{"type":25,"value":1630},{"type":19,"tag":57,"props":1634,"children":1635},{},[1636,1646,1655,1664],{"type":19,"tag":61,"props":1637,"children":1638},{},[1639],{"type":19,"tag":1640,"props":1641,"children":1643},"a",{"href":1642},"/guide/getting-started",[1644],{"type":25,"value":1645},"快速入门指南",{"type":19,"tag":61,"props":1647,"children":1648},{},[1649],{"type":19,"tag":1640,"props":1650,"children":1652},{"href":1651},"/guide/responsive-design",[1653],{"type":25,"value":1654},"响应式设计教程",{"type":19,"tag":61,"props":1656,"children":1657},{},[1658],{"type":19,"tag":1640,"props":1659,"children":1661},{"href":1660},"/guide/seo-optimization",[1662],{"type":25,"value":1663},"SEO 优化指南",{"type":19,"tag":61,"props":1665,"children":1666},{},[1667],{"type":19,"tag":1640,"props":1668,"children":1670},{"href":1669},"/templates",[1671],{"type":25,"value":1672},"模板市场",{"type":19,"tag":1674,"props":1675,"children":1676},"hr",{},[],{"type":19,"tag":27,"props":1678,"children":1679},{},[1680,1685,1687,1692],{"type":19,"tag":49,"props":1681,"children":1682},{},[1683],{"type":25,"value":1684},"提示",{"type":25,"value":1686},"：导出前建议先使用 ",{"type":19,"tag":49,"props":1688,"children":1689},{},[1690],{"type":25,"value":1691},"\"预览\"",{"type":25,"value":1693}," 功能在不同设备上测试效果，确保一切正常后再导出。",{"type":19,"tag":1695,"props":1696,"children":1697},"style",{},[1698],{"type":25,"value":1699},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":7,"searchDepth":336,"depth":336,"links":1701},[1702,1707,1711,1716,1717],{"id":35,"depth":315,"text":35,"children":1703},[1704,1705,1706],{"id":41,"depth":336,"text":44},{"id":182,"depth":336,"text":185},{"id":482,"depth":336,"text":485},{"id":797,"depth":315,"text":797,"children":1708},[1709,1710],{"id":802,"depth":336,"text":802},{"id":908,"depth":336,"text":908},{"id":1390,"depth":315,"text":1390,"children":1712},[1713,1714,1715],{"id":1395,"depth":336,"text":1395},{"id":1445,"depth":336,"text":1445},{"id":1478,"depth":336,"text":1478},{"id":1511,"depth":315,"text":1511},{"id":1630,"depth":315,"text":1630},"markdown","content:guide:export-frameworks.md","content","guide/export-frameworks.md","guide/export-frameworks","md",[1725,1737,1748],{"_path":1726,"_dir":1727,"_draft":6,"_partial":6,"_locale":7,"title":1728,"description":1729,"keywords":1730,"author":12,"date":1731,"category":1732,"image":1733,"_type":1718,"_id":1734,"_source":1720,"_file":1735,"_stem":1736,"_extension":1723},"/blog/accessibility-guidelines","blog","无障碍设计指南","WCAG 标准和无障碍设计最佳实践","无障碍设计指南, Blog, HTMLPAGE","2025-11-26","待分类","/content-images/blog/blog.jpg","content:blog:accessibility-guidelines.md","blog/accessibility-guidelines.md","blog/accessibility-guidelines",{"_path":1738,"_dir":1727,"_draft":6,"_partial":6,"_locale":7,"title":1739,"description":1740,"keywords":1741,"author":1742,"date":1743,"category":1744,"image":1733,"_type":1718,"_id":1745,"_source":1720,"_file":1746,"_stem":1747,"_extension":1723},"/blog/accessible-ux-research-guide","无障碍用户研究完全指南：从规划到实施的每一步","深入了解如何进行包容性的用户体验研究，确保残障用户的声音被听见，让产品真正为所有人而设计","用户研究, 无障碍设计, 包容设计, UX研究, 残障用户, 无障碍访问","HTMLPAGE 内容团队","2025-12-01","无障碍与设计","content:blog:accessible-ux-research-guide.md","blog/accessible-ux-research-guide.md","blog/accessible-ux-research-guide",{"_path":1749,"_dir":1727,"_draft":6,"_partial":6,"_locale":7,"title":1750,"description":1751,"keywords":1752,"author":12,"date":1731,"category":1732,"image":1733,"_type":1718,"_id":1753,"_source":1720,"_file":1754,"_stem":1755,"_extension":1723},"/blog/react-hooks-guide","React Hooks 实战指南","深入理解 React Hooks，包括 useState、useEffect、自定义 Hooks 等","React Hooks 实战指南, Blog, HTMLPAGE","content:blog:react-hooks-guide.md","blog/react-hooks-guide.md","blog/react-hooks-guide",1774945279015]