{"id":120065,"date":"2026-10-31T00:16:46","date_gmt":"2026-10-30T16:16:46","guid":{"rendered":"https:\/\/www.wsisp.com\/helps\/120065.html"},"modified":"2026-10-31T00:16:46","modified_gmt":"2026-10-30T16:16:46","slug":"%e3%80%90%e9%b8%bf%e8%92%99%e5%bf%83%e8%bf%b9%e3%80%91%e9%b8%bf%e8%92%99-pc-%e5%ba%94%e7%94%a8%e4%b8%8a%e6%9e%b6%e5%ae%9e%e6%88%98%ef%bc%9a%e5%88%86%e5%b8%83%e5%bc%8f-markdown-%e7%ac%94%e8%ae%b0","status":"publish","type":"post","link":"https:\/\/www.wsisp.com\/helps\/120065.html","title":{"rendered":"\u3010\u9e3f\u8499\u5fc3\u8ff9\u3011\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u5b9e\u6218\uff1a\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u4ece\u5f00\u53d1\u5230\u8fc7\u5ba1\u5168\u6d41\u7a0b"},"content":{"rendered":"<p>\u6458\u8981: \u672c\u6587\u8bb0\u5f55\u6211\u5f00\u53d1\u4e00\u6b3e\u9e3f\u8499 PC \u7aef\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u5e94\u7528\u5e76\u5b8c\u6210\u5e94\u7528\u5e02\u573a\u4e0a\u67b6\u7684\u5168\u8fc7\u7a0b\u3002\u4ece\u9700\u6c42\u8bbe\u8ba1\u3001\u7f16\u8f91\u5668\u5185\u6838\u5b9e\u73b0\u3001\u5206\u5e03\u5f0f\u6570\u636e\u540c\u6b65\u3001PC \u7aef\u7a97\u53e3\u9002\u914d&#xff0c;\u5230\u4e0a\u67b6\u8d44\u8d28\u51c6\u5907\u3001\u5ba1\u6838\u907f\u5751\u3001\u4e0a\u67b6\u540e\u4f18\u5316\u8fed\u4ee3&#xff0c;\u8986\u76d6\u5e94\u7528\u843d\u5730\u5b8c\u6574\u94fe\u8def\u3002\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u9047\u5230\u5206\u5e03\u5f0f\u6570\u636e\u51b2\u7a81\u3001\u7a97\u53e3\u751f\u547d\u5468\u671f\u3001\u8f6f\u952e\u76d8\u906e\u6321\u3001\u5ba1\u6838\u88ab\u62d2 4 \u7c7b\u5171 6 \u4e2a\u771f\u5b9e\u8e29\u5751\u95ee\u9898&#xff0c;\u9010\u4e00\u7ed9\u51fa\u5b9a\u4f4d\u4e0e\u89e3\u6cd5\u3002\u5e94\u7528\u4e0a\u67b6\u540e 30 \u5929\u5185\u4e0b\u8f7d 4200 \u6b21&#xff0c;\u8bc4\u5206 4.6 \u661f&#xff0c;\u5206\u5e03\u5f0f\u540c\u6b65\u5ef6\u8fdf 180ms\u3002<\/p>\n<p>\u73af\u5883\u8bf4\u660e: DevEco Studio 5.0.5\u3001HarmonyOS PC 5.0.1\u3001API 18&#xff08;PC \u4e13\u5c5e\u80fd\u529b&#xff09;\u3001\u5206\u5e03\u5f0f\u6570\u636e\u7ba1\u7406\u670d\u52a1 version 2.1<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2026\/10\/20261030161644-6ae4c2ec23ea6.png\" alt=\"\u9e3f\u8499 PC \u684c\u9762\u8fd0\u884c Markdown \u7b14\u8bb0\u5e94\u7528\u622a\u56fe\" \/><\/p>\n<h3>\u80cc\u666f\u4e0e\u75db\u70b9<\/h3>\n<p>\u6211\u4e00\u76f4\u5728\u7528 Typora \u5199\u6280\u672f\u7b14\u8bb0&#xff0c;\u4f46\u6362\u5230\u9e3f\u8499 PC \u540e\u6ca1\u6709\u5408\u9002\u7684 Markdown \u7f16\u8f91\u5668\u3002\u5e02\u9762\u4e0a\u7684\u9e3f\u8499\u5e94\u7528\u4e3b\u8981\u96c6\u4e2d\u5728\u624b\u673a\u7aef&#xff0c;PC \u7aef\u751f\u4ea7\u529b\u5de5\u5177\u51e0\u4e4e\u662f\u7a7a\u767d\u3002\u6b63\u597d\u8d76\u4e0a\u5f00\u6e90\u9e3f\u8499 PC \u8d5b\u4e8b&#xff0c;\u6211\u51b3\u5b9a\u81ea\u5df1\u5f00\u53d1\u4e00\u6b3e Markdown \u7b14\u8bb0\u5e94\u7528&#xff0c;\u540d\u5b57\u53eb\u300c\u5206\u5e03\u5f0f\u7b14\u8bb0\u300d\u3002<\/p>\n<p>\u9009\u8fd9\u4e2a\u65b9\u5411\u6709\u4e09\u4e2a\u8003\u8651&#xff1a;<\/p>\n<ul>\n<li>\u521a\u9700&#xff1a;\u9e3f\u8499 PC \u7f3a\u5c11\u597d\u7528\u7684 Markdown \u7f16\u8f91\u5668&#xff0c;\u4e0a\u67b6\u540e\u6709\u771f\u5b9e\u7528\u6237\u4ef7\u503c<\/li>\n<li>\u5c55\u793a\u5206\u5e03\u5f0f\u80fd\u529b&#xff1a;\u9e3f\u8499\u7684\u5206\u5e03\u5f0f\u6570\u636e\u7ba1\u7406\u662f\u6838\u5fc3\u5356\u70b9&#xff0c;\u7b14\u8bb0\u8de8\u8bbe\u5907\u540c\u6b65\u662f\u5929\u7136\u573a\u666f<\/li>\n<li>\u4e0a\u67b6\u96be\u5ea6\u9002\u4e2d&#xff1a;\u7b14\u8bb0\u7c7b\u5e94\u7528\u4e0d\u6d89\u53ca\u652f\u4ed8\u3001\u793e\u4ea4\u7b49\u654f\u611f\u80fd\u529b&#xff0c;\u5ba1\u6838\u76f8\u5bf9\u53ef\u63a7<\/li>\n<\/ul>\n<p>\u4f46\u771f\u6b63\u52a8\u624b\u540e\u624d\u53d1\u73b0&#xff0c;\u4ece\u300c\u80fd\u8dd1\u7684 Demo\u300d\u5230\u300c\u80fd\u8fc7\u5ba1\u4e0a\u67b6\u7684\u5e94\u7528\u300d\u4e4b\u95f4\u6709\u5de8\u5927\u7684\u5de5\u7a0b\u91cf\u3002\u6211\u524d\u540e\u7ecf\u5386\u4e86\u4e09\u8f6e\u5ba1\u6838\u88ab\u62d2&#xff0c;\u7d2f\u8ba1\u4fee\u6539 17 \u4e2a\u95ee\u9898\u9879&#xff0c;\u4ece\u63d0\u4ea4\u5230\u8fc7\u5ba1\u82b1\u4e86 22 \u5929\u3002\u8fd9\u7bc7\u6587\u7ae0\u628a\u5b8c\u6574\u6d41\u7a0b\u8bb0\u5f55\u4e0b\u6765&#xff0c;\u91cd\u70b9\u662f\u5ba1\u6838\u88ab\u62d2\u7684\u539f\u56e0\u548c\u4fee\u590d\u65b9\u6848&#xff0c;\u5e0c\u671b\u80fd\u5e2e\u51c6\u5907\u4e0a\u67b6\u7684\u5f00\u53d1\u8005\u5c11\u8d70\u5f2f\u8def\u3002<\/p>\n<h3>\u5e94\u7528\u9700\u6c42\u8bbe\u8ba1\u4e0e\u6280\u672f\u9009\u578b<\/h3>\n<h4>2.1 \u6838\u5fc3\u529f\u80fd\u9700\u6c42<\/h4>\n<p>\u7ecf\u8fc7\u4e24\u5468\u7684\u7528\u6237\u8c03\u7814&#xff08;\u5728\u9e3f\u8499 PC \u793e\u533a\u53d1\u5e16\u6536\u96c6\u9700\u6c42&#xff09;&#xff0c;\u6700\u7ec8\u786e\u5b9a\u7684\u529f\u80fd\u4f18\u5148\u7ea7&#xff1a;<\/p>\n<table>\n<tr>\u4f18\u5148\u7ea7\u529f\u80fd\u8bf4\u660e\u5de5\u4f5c\u91cf<\/tr>\n<tbody>\n<tr>\n<td>P0<\/td>\n<td>Markdown \u7f16\u8f91 &#043; \u5b9e\u65f6\u9884\u89c8<\/td>\n<td>\u5206\u680f\u5e03\u5c40&#xff0c;\u5de6\u4fa7\u7f16\u8f91\u53f3\u4fa7\u9884\u89c8<\/td>\n<td>3 \u5929<\/td>\n<\/tr>\n<tr>\n<td>P0<\/td>\n<td>\u672c\u5730\u6587\u4ef6\u7ba1\u7406<\/td>\n<td>\u65b0\u5efa\/\u4fdd\u5b58\/\u6253\u5f00 .md \u6587\u4ef6<\/td>\n<td>2 \u5929<\/td>\n<\/tr>\n<tr>\n<td>P0<\/td>\n<td>\u5206\u5e03\u5f0f\u540c\u6b65<\/td>\n<td>\u8de8\u8bbe\u5907\u7b14\u8bb0\u81ea\u52a8\u540c\u6b65<\/td>\n<td>4 \u5929<\/td>\n<\/tr>\n<tr>\n<td>P1<\/td>\n<td>\u5feb\u6377\u952e\u4f53\u7cfb<\/td>\n<td>Ctrl&#043;S \u4fdd\u5b58\u3001Ctrl&#043;B \u52a0\u7c97\u7b49<\/td>\n<td>1 \u5929<\/td>\n<\/tr>\n<tr>\n<td>P1<\/td>\n<td>\u4e3b\u9898\u5207\u6362<\/td>\n<td>\u660e\u6697\u4e3b\u9898 &#043; \u4ee3\u7801\u9ad8\u4eae\u4e3b\u9898<\/td>\n<td>1 \u5929<\/td>\n<\/tr>\n<tr>\n<td>P2<\/td>\n<td>\u5bfc\u51fa PDF<\/td>\n<td>\u628a Markdown \u5bfc\u51fa\u4e3a PDF<\/td>\n<td>2 \u5929<\/td>\n<\/tr>\n<tr>\n<td>P2<\/td>\n<td>\u76ee\u5f55\u6811<\/td>\n<td>\u591a\u6587\u4ef6\u7ba1\u7406&#xff0c;\u6587\u4ef6\u5939\u5d4c\u5957<\/td>\n<td>2 \u5929<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p>P0 \u529f\u80fd\u662f\u4e0a\u67b6\u6700\u5c0f\u53ef\u884c\u4ea7\u54c1&#xff0c;P1\/P2 \u5728\u7248\u672c\u8fed\u4ee3\u4e2d\u8865\u5145\u3002<\/p>\n<h4>2.2 \u6280\u672f\u9009\u578b\u51b3\u7b56<\/h4>\n<p>#mermaid-svg-TGcHWb9I2OFdTB04{font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-TGcHWb9I2OFdTB04 .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-TGcHWb9I2OFdTB04 .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-TGcHWb9I2OFdTB04 .error-icon{fill:#552222;}#mermaid-svg-TGcHWb9I2OFdTB04 .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-TGcHWb9I2OFdTB04 .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-TGcHWb9I2OFdTB04 .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-TGcHWb9I2OFdTB04 .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-TGcHWb9I2OFdTB04 .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-TGcHWb9I2OFdTB04 .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-TGcHWb9I2OFdTB04 .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-TGcHWb9I2OFdTB04 .marker{fill:#333333;stroke:#333333;}#mermaid-svg-TGcHWb9I2OFdTB04 .marker.cross{stroke:#333333;}#mermaid-svg-TGcHWb9I2OFdTB04 svg{font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-TGcHWb9I2OFdTB04 p{margin:0;}#mermaid-svg-TGcHWb9I2OFdTB04 .label{font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;color:#333;}#mermaid-svg-TGcHWb9I2OFdTB04 .cluster-label text{fill:#333;}#mermaid-svg-TGcHWb9I2OFdTB04 .cluster-label span{color:#333;}#mermaid-svg-TGcHWb9I2OFdTB04 .cluster-label span p{background-color:transparent;}#mermaid-svg-TGcHWb9I2OFdTB04 .label text,#mermaid-svg-TGcHWb9I2OFdTB04 span{fill:#333;color:#333;}#mermaid-svg-TGcHWb9I2OFdTB04 .node rect,#mermaid-svg-TGcHWb9I2OFdTB04 .node circle,#mermaid-svg-TGcHWb9I2OFdTB04 .node ellipse,#mermaid-svg-TGcHWb9I2OFdTB04 .node polygon,#mermaid-svg-TGcHWb9I2OFdTB04 .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-TGcHWb9I2OFdTB04 .rough-node .label text,#mermaid-svg-TGcHWb9I2OFdTB04 .node .label text,#mermaid-svg-TGcHWb9I2OFdTB04 .image-shape .label,#mermaid-svg-TGcHWb9I2OFdTB04 .icon-shape .label{text-anchor:middle;}#mermaid-svg-TGcHWb9I2OFdTB04 .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-TGcHWb9I2OFdTB04 .rough-node .label,#mermaid-svg-TGcHWb9I2OFdTB04 .node .label,#mermaid-svg-TGcHWb9I2OFdTB04 .image-shape .label,#mermaid-svg-TGcHWb9I2OFdTB04 .icon-shape .label{text-align:center;}#mermaid-svg-TGcHWb9I2OFdTB04 .node.clickable{cursor:pointer;}#mermaid-svg-TGcHWb9I2OFdTB04 .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-TGcHWb9I2OFdTB04 .arrowheadPath{fill:#333333;}#mermaid-svg-TGcHWb9I2OFdTB04 .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-TGcHWb9I2OFdTB04 .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-TGcHWb9I2OFdTB04 .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-TGcHWb9I2OFdTB04 .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-TGcHWb9I2OFdTB04 .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-TGcHWb9I2OFdTB04 .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-TGcHWb9I2OFdTB04 .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-TGcHWb9I2OFdTB04 .cluster text{fill:#333;}#mermaid-svg-TGcHWb9I2OFdTB04 .cluster span{color:#333;}#mermaid-svg-TGcHWb9I2OFdTB04 div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-TGcHWb9I2OFdTB04 .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-TGcHWb9I2OFdTB04 rect.text{fill:none;stroke-width:0;}#mermaid-svg-TGcHWb9I2OFdTB04 .icon-shape,#mermaid-svg-TGcHWb9I2OFdTB04 .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-TGcHWb9I2OFdTB04 .icon-shape p,#mermaid-svg-TGcHWb9I2OFdTB04 .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-TGcHWb9I2OFdTB04 .icon-shape .label rect,#mermaid-svg-TGcHWb9I2OFdTB04 .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-TGcHWb9I2OFdTB04 .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-TGcHWb9I2OFdTB04 .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-TGcHWb9I2OFdTB04 :root{&#8211;mermaid-font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;}<span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/p>\n<p>\u81ea\u7814 TextArea<\/p>\n<p><\/span><span class=\"edgeLabel\"><\/p>\n<p>RichEditor \u7ec4\u4ef6<\/p>\n<p><\/span><span class=\"edgeLabel\"><\/p>\n<p>WebView &#043; \u5f00\u6e90\u7f16\u8f91\u5668<\/p>\n<p><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/p>\n<p>\u5426,\u7eafMarkdown<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u6280\u672f\u9009\u578b<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u7f16\u8f91\u5668\u5185\u6838<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u7075\u6d3b\u53ef\u63a7\u4f46\u5de5\u4f5c\u91cf\u5927<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u7cfb\u7edf\u7ec4\u4ef6\u529f\u80fd\u53d7\u9650<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u529f\u80fd\u5b8c\u6574\u4f46\u6027\u80fd\u5dee<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u662f\u5426\u9700\u8981\u5bcc\u6587\u672c?<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u9009\u81ea\u7814 TextArea&#043; \u81ea\u5b9a\u4e49\u89e3\u6790\u5668<\/p>\n<p><\/span><\/p>\n<p>\u6700\u7ec8\u6280\u672f\u65b9\u6848&#xff1a;<\/p>\n<ul>\n<li>\u7f16\u8f91\u5668&#xff1a;\u81ea\u7814 TextArea &#043; \u81ea\u5199 Markdown \u89e3\u6790\u5668\u3002\u9e3f\u8499 PC \u7684 RichEditor \u7ec4\u4ef6\u4e0d\u652f\u6301\u81ea\u5b9a\u4e49\u8bed\u6cd5\u9ad8\u4eae&#xff0c;WebView \u65b9\u6848\u5728 PC \u7aef\u5185\u5b58\u5360\u7528\u8fc7\u9ad8&#xff08;200MB&#043;&#xff09;&#xff0c;\u81ea\u7814\u6700\u53ef\u63a7<\/li>\n<li>\u9884\u89c8&#xff1a;ArkUI \u539f\u751f\u7ec4\u4ef6\u6e32\u67d3&#xff0c;\u628a Markdown AST \u6620\u5c04\u6210 ArkUI \u7ec4\u4ef6\u6811&#xff0c;\u4e0d\u7528 WebView<\/li>\n<li>\u5206\u5e03\u5f0f\u540c\u6b65&#xff1a;\u9e3f\u8499\u5206\u5e03\u5f0f\u6570\u636e\u7ba1\u7406\u670d\u52a1&#xff08;distributedData&#xff09;&#xff0c;KV \u6570\u636e\u6a21\u578b&#xff0c;\u7b14\u8bb0\u5185\u5bb9\u6309\u6bb5\u843d\u5206\u7247\u5b58\u50a8<\/li>\n<li>\u6587\u4ef6\u5b58\u50a8&#xff1a;\u5e94\u7528\u6c99\u7bb1 &#043; \u7528\u6237\u6587\u6863\u76ee\u5f55\u53cc\u5199&#xff0c;\u6c99\u7bb1\u7528\u4e8e\u5206\u5e03\u5f0f\u540c\u6b65&#xff0c;\u6587\u6863\u76ee\u5f55\u7528\u4e8e\u7528\u6237\u76f4\u63a5\u8bbf\u95ee<\/li>\n<\/ul>\n<hr \/>\n<h3>\u6838\u5fc3\u529f\u80fd\u5f00\u53d1<\/h3>\n<h4>3.1 \u7f16\u8f91\u5668\u5185\u6838\u5b9e\u73b0<\/h4>\n<p>\u7f16\u8f91\u5668\u6838\u5fc3\u662f TextArea \u7684\u6587\u672c\u53d8\u5316\u76d1\u542c &#043; Markdown \u5b9e\u65f6\u89e3\u6790\u3002\u89e3\u6790\u5668\u7528\u7eaf ArkTS \u5b9e\u73b0&#xff0c;\u652f\u6301 CommonMark \u57fa\u7840\u8bed\u6cd5 &#043; GFM \u8868\u683c\u6269\u5c55\u3002<\/p>\n<p>\u6587\u672c\u53d8\u5316\u76d1\u542c\u4e0e\u589e\u91cf\u89e3\u6790&#xff1a;<\/p>\n<p><span class=\"token comment\">\/\/ EditorComponent.ets &#8211; \u7f16\u8f91\u5668\u7ec4\u4ef6<\/span><br \/>\n<span class=\"token comment\">\/\/ \u4e3a\u4ec0\u4e48\u7528\u589e\u91cf\u89e3\u6790\u800c\u975e\u5168\u91cf\u89e3\u6790&#xff1a;\u6587\u6863\u8d85\u8fc7 5000 \u5b57\u65f6\u5168\u91cf\u89e3\u6790\u8017\u65f6 80ms&#043;&#xff0c;<\/span><br \/>\n<span class=\"token comment\">\/\/ \u589e\u91cf\u89e3\u6790\u53ea\u5904\u7406\u53d8\u5316\u6bb5\u843d&#xff0c;\u8017\u65f6\u964d\u5230 5ms \u4ee5\u5185<\/span><br \/>\n<span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">Component<\/span><\/span><br \/>\n<span class=\"token keyword\">export<\/span> struct EditorComponent <span class=\"token punctuation\">{<\/span><br \/>\n  <span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">State<\/span><\/span> <span class=\"token keyword\">private<\/span> rawText<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span> <span class=\"token operator\">&#061;<\/span> <span class=\"token string\">&#039;&#039;<\/span><br \/>\n  <span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">State<\/span><\/span> <span class=\"token keyword\">private<\/span> astNodes<span class=\"token operator\">:<\/span> MarkdownNode<span class=\"token punctuation\">[<\/span><span class=\"token punctuation\">]<\/span> <span class=\"token operator\">&#061;<\/span> <span class=\"token punctuation\">[<\/span><span class=\"token punctuation\">]<\/span><br \/>\n  <span class=\"token keyword\">private<\/span> parser<span class=\"token operator\">:<\/span> MarkdownParser <span class=\"token operator\">&#061;<\/span> <span class=\"token keyword\">new<\/span> <span class=\"token class-name\">MarkdownParser<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token keyword\">private<\/span> lastParsePosition<span class=\"token operator\">:<\/span> <span class=\"token builtin\">number<\/span> <span class=\"token operator\">&#061;<\/span> <span class=\"token number\">0<\/span><\/p>\n<p>  <span class=\"token function\">build<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token function\">TextArea<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span> placeholder<span class=\"token operator\">:<\/span> <span class=\"token string\">&#039;\u5f00\u59cb\u8f93\u5165 Markdown&#8230;&#039;<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">.<\/span><span class=\"token function\">width<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;50%&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">.<\/span><span class=\"token function\">height<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;100%&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">.<\/span><span class=\"token function\">fontSize<\/span><span class=\"token punctuation\">(<\/span><span class=\"token number\">16<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">.<\/span><span class=\"token function\">fontColor<\/span><span class=\"token punctuation\">(<\/span><span class=\"token function\">$r<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;app.color.editor_text&#039;<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">.<\/span><span class=\"token function\">backgroundColor<\/span><span class=\"token punctuation\">(<\/span><span class=\"token function\">$r<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;app.color.editor_bg&#039;<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">.<\/span><span class=\"token function\">onChange<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">(<\/span>value<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">&#061;&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n        <span class=\"token comment\">\/\/ \u8ba1\u7b97\u53d8\u5316\u533a\u57df&#xff0c;\u53ea\u91cd\u65b0\u89e3\u6790\u53d7\u5f71\u54cd\u7684\u6bb5\u843d<\/span><br \/>\n        <span class=\"token keyword\">const<\/span> changeRange <span class=\"token operator\">&#061;<\/span> <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">detectChangeRange<\/span><span class=\"token punctuation\">(<\/span><span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>rawText<span class=\"token punctuation\">,<\/span> value<span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>rawText <span class=\"token operator\">&#061;<\/span> value<br \/>\n        <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">incrementalParse<\/span><span class=\"token punctuation\">(<\/span>changeRange<span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><\/p>\n<p>  <span class=\"token keyword\">private<\/span> <span class=\"token function\">detectChangeRange<\/span><span class=\"token punctuation\">(<\/span>oldText<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span><span class=\"token punctuation\">,<\/span> newText<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span><span class=\"token punctuation\">)<\/span><span class=\"token operator\">:<\/span> ChangeRange <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token comment\">\/\/ \u627e\u524d\u540e\u6587\u672c\u7684\u7b2c\u4e00\u4e2a\u5dee\u5f02\u70b9\u548c\u6700\u540e\u4e00\u4e2a\u5dee\u5f02\u70b9<\/span><br \/>\n    <span class=\"token keyword\">let<\/span> start <span class=\"token operator\">&#061;<\/span> <span class=\"token number\">0<\/span><br \/>\n    <span class=\"token keyword\">while<\/span> <span class=\"token punctuation\">(<\/span>start <span class=\"token operator\">&lt;<\/span> oldText<span class=\"token punctuation\">.<\/span>length <span class=\"token operator\">&amp;&amp;<\/span> start <span class=\"token operator\">&lt;<\/span> newText<span class=\"token punctuation\">.<\/span>length<br \/>\n           <span class=\"token operator\">&amp;&amp;<\/span> oldText<span class=\"token punctuation\">[<\/span>start<span class=\"token punctuation\">]<\/span> <span class=\"token operator\">&#061;&#061;&#061;<\/span> newText<span class=\"token punctuation\">[<\/span>start<span class=\"token punctuation\">]<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      start<span class=\"token operator\">&#043;&#043;<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token keyword\">let<\/span> oldEnd <span class=\"token operator\">&#061;<\/span> oldText<span class=\"token punctuation\">.<\/span>length <span class=\"token operator\">&#8211;<\/span> <span class=\"token number\">1<\/span><br \/>\n    <span class=\"token keyword\">let<\/span> newEnd <span class=\"token operator\">&#061;<\/span> newText<span class=\"token punctuation\">.<\/span>length <span class=\"token operator\">&#8211;<\/span> <span class=\"token number\">1<\/span><br \/>\n    <span class=\"token keyword\">while<\/span> <span class=\"token punctuation\">(<\/span>oldEnd <span class=\"token operator\">&gt;&#061;<\/span> start <span class=\"token operator\">&amp;&amp;<\/span> newEnd <span class=\"token operator\">&gt;&#061;<\/span> start<br \/>\n           <span class=\"token operator\">&amp;&amp;<\/span> oldText<span class=\"token punctuation\">[<\/span>oldEnd<span class=\"token punctuation\">]<\/span> <span class=\"token operator\">&#061;&#061;&#061;<\/span> newText<span class=\"token punctuation\">[<\/span>newEnd<span class=\"token punctuation\">]<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      oldEnd<span class=\"token operator\">&#8212;<\/span><span class=\"token punctuation\">;<\/span> newEnd<span class=\"token operator\">&#8212;<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token comment\">\/\/ \u627e\u5230\u53d8\u5316\u6240\u5728\u7684\u6bb5\u843d\u8fb9\u754c&#xff08;\u53cc\u6362\u884c\u7b26&#xff09;<\/span><br \/>\n    <span class=\"token keyword\">return<\/span> <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">expandToParagraph<\/span><span class=\"token punctuation\">(<\/span>newText<span class=\"token punctuation\">,<\/span> start<span class=\"token punctuation\">,<\/span> newEnd <span class=\"token operator\">&#043;<\/span> <span class=\"token number\">1<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><\/p>\n<p>  <span class=\"token keyword\">private<\/span> <span class=\"token function\">incrementalParse<\/span><span class=\"token punctuation\">(<\/span>range<span class=\"token operator\">:<\/span> ChangeRange<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token comment\">\/\/ \u53ea\u91cd\u65b0\u89e3\u6790\u53d8\u5316\u6bb5\u843d&#xff0c;\u66ff\u6362 AST \u4e2d\u5bf9\u5e94\u8282\u70b9<\/span><br \/>\n    <span class=\"token keyword\">const<\/span> newNodes <span class=\"token operator\">&#061;<\/span> <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>parser<span class=\"token punctuation\">.<\/span><span class=\"token function\">parseParagraphs<\/span><span class=\"token punctuation\">(<\/span><span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>rawText<span class=\"token punctuation\">,<\/span> range<span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>astNodes <span class=\"token operator\">&#061;<\/span> <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">mergeAstNodes<\/span><span class=\"token punctuation\">(<\/span><span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>astNodes<span class=\"token punctuation\">,<\/span> newNodes<span class=\"token punctuation\">,<\/span> range<span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token comment\">\/\/ \u89e6\u53d1\u9884\u89c8\u533a\u66f4\u65b0<\/span><br \/>\n    AppStorage<span class=\"token punctuation\">.<\/span><span class=\"token function\">setOrCreate<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;previewAst&#039;<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>astNodes<span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><br \/>\n<span class=\"token punctuation\">}<\/span><\/p>\n<h4>3.2 \u9884\u89c8\u533a\u6e32\u67d3<\/h4>\n<p>\u9884\u89c8\u533a\u628a Markdown AST \u6620\u5c04\u6210 ArkUI \u7ec4\u4ef6\u6811\u3002\u5173\u952e\u662f\u9012\u5f52\u6e32\u67d3\u4e0d\u540c\u8282\u70b9\u7c7b\u578b&#xff1a;<\/p>\n<p><span class=\"token comment\">\/\/ PreviewComponent.ets &#8211; \u9884\u89c8\u7ec4\u4ef6<\/span><br \/>\n<span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">Component<\/span><\/span><br \/>\n<span class=\"token keyword\">export<\/span> struct PreviewComponent <span class=\"token punctuation\">{<\/span><br \/>\n  <span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">StorageLink<\/span><\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;previewAst&#039;<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token keyword\">private<\/span> astNodes<span class=\"token operator\">:<\/span> MarkdownNode<span class=\"token punctuation\">[<\/span><span class=\"token punctuation\">]<\/span> <span class=\"token operator\">&#061;<\/span> <span class=\"token punctuation\">[<\/span><span class=\"token punctuation\">]<\/span><\/p>\n<p>  <span class=\"token function\">build<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token function\">Scroll<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token function\">Column<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n        <span class=\"token function\">ForEach<\/span><span class=\"token punctuation\">(<\/span><span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>astNodes<span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">(<\/span>node<span class=\"token operator\">:<\/span> MarkdownNode<span class=\"token punctuation\">)<\/span> <span class=\"token operator\">&#061;&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n          <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">renderNode<\/span><span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">(<\/span>node<span class=\"token operator\">:<\/span> MarkdownNode<span class=\"token punctuation\">)<\/span> <span class=\"token operator\">&#061;&gt;<\/span> node<span class=\"token punctuation\">.<\/span>id<span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">}<\/span><br \/>\n      <span class=\"token punctuation\">.<\/span><span class=\"token function\">width<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;100%&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">.<\/span><span class=\"token function\">padding<\/span><span class=\"token punctuation\">(<\/span><span class=\"token number\">16<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token punctuation\">.<\/span><span class=\"token function\">width<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;50%&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">.<\/span><span class=\"token function\">height<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;100%&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">.<\/span><span class=\"token function\">scrollBar<\/span><span class=\"token punctuation\">(<\/span>BarState<span class=\"token punctuation\">.<\/span>Auto<span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><\/p>\n<p>  <span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">Builder<\/span><\/span> <span class=\"token function\">renderNode<\/span><span class=\"token punctuation\">(<\/span>node<span class=\"token operator\">:<\/span> MarkdownNode<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">.<\/span>type <span class=\"token operator\">&#061;&#061;&#061;<\/span> <span class=\"token string\">&#039;heading&#039;<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token function\">Text<\/span><span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">.<\/span>text<span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token punctuation\">.<\/span><span class=\"token function\">fontSize<\/span><span class=\"token punctuation\">(<\/span><span class=\"token number\">28<\/span> <span class=\"token operator\">&#8211;<\/span> <span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">.<\/span>level <span class=\"token operator\">&#8211;<\/span> <span class=\"token number\">1<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">*<\/span> <span class=\"token number\">4<\/span><span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token punctuation\">.<\/span><span class=\"token function\">fontWeight<\/span><span class=\"token punctuation\">(<\/span>FontWeight<span class=\"token punctuation\">.<\/span>Bold<span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token punctuation\">.<\/span><span class=\"token function\">margin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span> top<span class=\"token operator\">:<\/span> <span class=\"token number\">16<\/span><span class=\"token punctuation\">,<\/span> bottom<span class=\"token operator\">:<\/span> <span class=\"token number\">8<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">else<\/span> <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">.<\/span>type <span class=\"token operator\">&#061;&#061;&#061;<\/span> <span class=\"token string\">&#039;paragraph&#039;<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token function\">Text<\/span><span class=\"token punctuation\">(<\/span><span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">renderInline<\/span><span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">.<\/span>children<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token punctuation\">.<\/span><span class=\"token function\">fontSize<\/span><span class=\"token punctuation\">(<\/span><span class=\"token number\">16<\/span><span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token punctuation\">.<\/span><span class=\"token function\">lineHeight<\/span><span class=\"token punctuation\">(<\/span><span class=\"token number\">24<\/span><span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token punctuation\">.<\/span><span class=\"token function\">margin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span> bottom<span class=\"token operator\">:<\/span> <span class=\"token number\">12<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">else<\/span> <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">.<\/span>type <span class=\"token operator\">&#061;&#061;&#061;<\/span> <span class=\"token string\">&#039;code_block&#039;<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">renderCodeBlock<\/span><span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">else<\/span> <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">.<\/span>type <span class=\"token operator\">&#061;&#061;&#061;<\/span> <span class=\"token string\">&#039;table&#039;<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">renderTable<\/span><span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token comment\">\/\/ &#8230; \u5176\u4ed6\u8282\u70b9\u7c7b\u578b<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><br \/>\n<span class=\"token punctuation\">}<\/span><\/p>\n<h4>3.3 \u5206\u5e03\u5f0f\u6570\u636e\u540c\u6b65<\/h4>\n<p>\u8fd9\u662f\u5e94\u7528\u7684\u6838\u5fc3\u5356\u70b9&#xff0c;\u4e5f\u662f\u5f00\u53d1\u4e2d\u6700\u590d\u6742\u7684\u90e8\u5206\u3002\u9e3f\u8499\u5206\u5e03\u5f0f\u6570\u636e\u7ba1\u7406\u63d0\u4f9b KV \u6570\u636e\u6a21\u578b&#xff0c;\u591a\u8bbe\u5907\u95f4\u81ea\u52a8\u540c\u6b65\u3002<\/p>\n<p>\u540c\u6b65\u67b6\u6784&#xff1a;<\/p>\n<p>#mermaid-svg-wQMNE7vfPdnrpKNh{font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-wQMNE7vfPdnrpKNh .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-wQMNE7vfPdnrpKNh .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-wQMNE7vfPdnrpKNh .error-icon{fill:#552222;}#mermaid-svg-wQMNE7vfPdnrpKNh .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-wQMNE7vfPdnrpKNh .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-wQMNE7vfPdnrpKNh .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-wQMNE7vfPdnrpKNh .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-wQMNE7vfPdnrpKNh .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-wQMNE7vfPdnrpKNh .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-wQMNE7vfPdnrpKNh .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-wQMNE7vfPdnrpKNh .marker{fill:#333333;stroke:#333333;}#mermaid-svg-wQMNE7vfPdnrpKNh .marker.cross{stroke:#333333;}#mermaid-svg-wQMNE7vfPdnrpKNh svg{font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-wQMNE7vfPdnrpKNh p{margin:0;}#mermaid-svg-wQMNE7vfPdnrpKNh .label{font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;color:#333;}#mermaid-svg-wQMNE7vfPdnrpKNh .cluster-label text{fill:#333;}#mermaid-svg-wQMNE7vfPdnrpKNh .cluster-label span{color:#333;}#mermaid-svg-wQMNE7vfPdnrpKNh .cluster-label span p{background-color:transparent;}#mermaid-svg-wQMNE7vfPdnrpKNh .label text,#mermaid-svg-wQMNE7vfPdnrpKNh span{fill:#333;color:#333;}#mermaid-svg-wQMNE7vfPdnrpKNh .node rect,#mermaid-svg-wQMNE7vfPdnrpKNh .node circle,#mermaid-svg-wQMNE7vfPdnrpKNh .node ellipse,#mermaid-svg-wQMNE7vfPdnrpKNh .node polygon,#mermaid-svg-wQMNE7vfPdnrpKNh .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-wQMNE7vfPdnrpKNh .rough-node .label text,#mermaid-svg-wQMNE7vfPdnrpKNh .node .label text,#mermaid-svg-wQMNE7vfPdnrpKNh .image-shape .label,#mermaid-svg-wQMNE7vfPdnrpKNh .icon-shape .label{text-anchor:middle;}#mermaid-svg-wQMNE7vfPdnrpKNh .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-wQMNE7vfPdnrpKNh .rough-node .label,#mermaid-svg-wQMNE7vfPdnrpKNh .node .label,#mermaid-svg-wQMNE7vfPdnrpKNh .image-shape .label,#mermaid-svg-wQMNE7vfPdnrpKNh .icon-shape .label{text-align:center;}#mermaid-svg-wQMNE7vfPdnrpKNh .node.clickable{cursor:pointer;}#mermaid-svg-wQMNE7vfPdnrpKNh .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-wQMNE7vfPdnrpKNh .arrowheadPath{fill:#333333;}#mermaid-svg-wQMNE7vfPdnrpKNh .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-wQMNE7vfPdnrpKNh .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-wQMNE7vfPdnrpKNh .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-wQMNE7vfPdnrpKNh .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-wQMNE7vfPdnrpKNh .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-wQMNE7vfPdnrpKNh .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-wQMNE7vfPdnrpKNh .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-wQMNE7vfPdnrpKNh .cluster text{fill:#333;}#mermaid-svg-wQMNE7vfPdnrpKNh .cluster span{color:#333;}#mermaid-svg-wQMNE7vfPdnrpKNh div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-wQMNE7vfPdnrpKNh .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-wQMNE7vfPdnrpKNh rect.text{fill:none;stroke-width:0;}#mermaid-svg-wQMNE7vfPdnrpKNh .icon-shape,#mermaid-svg-wQMNE7vfPdnrpKNh .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-wQMNE7vfPdnrpKNh .icon-shape p,#mermaid-svg-wQMNE7vfPdnrpKNh .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-wQMNE7vfPdnrpKNh .icon-shape .label rect,#mermaid-svg-wQMNE7vfPdnrpKNh .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-wQMNE7vfPdnrpKNh .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-wQMNE7vfPdnrpKNh .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-wQMNE7vfPdnrpKNh :root{&#8211;mermaid-font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;}<span class=\"nodeLabel\"><\/p>\n<p>\u8bbe\u5907 B &#8211; \u9e3f\u8499\u624b\u673a<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u5206\u5e03\u5f0f\u6570\u636e\u670d\u52a1<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u8bbe\u5907 A &#8211; \u9e3f\u8499 PC<\/p>\n<p><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u7f16\u8f91\u5668\u672c\u5730\u4fee\u6539<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u672c\u5730 KVStorenotes_kv<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u540c\u6b65\u5f15\u64ce\u76d1\u542c\u53d8\u66f4<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u5206\u5e03\u5f0f KVStore\u81ea\u52a8\u540c\u6b65<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u51b2\u7a81\u89e3\u51b3LWW \u7b56\u7565<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u540c\u6b65\u5f15\u64ce\u76d1\u542c\u53d8\u66f4<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u672c\u5730 KVStorenotes_kv<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u7f16\u8f91\u5668\u6536\u5230\u66f4\u65b0<\/p>\n<p><\/span><\/p>\n<p>\u540c\u6b65\u5f15\u64ce\u5b9e\u73b0&#xff1a;<\/p>\n<p><span class=\"token comment\">\/\/ DistributedSync.ets &#8211; \u5206\u5e03\u5f0f\u540c\u6b65\u5f15\u64ce<\/span><br \/>\n<span class=\"token comment\">\/\/ \u4e3a\u4ec0\u4e48\u6309\u6bb5\u843d\u5206\u7247\u5b58\u50a8\u800c\u975e\u6574\u7bc7\u5b58\u50a8&#xff1a;\u6574\u7bc7\u6587\u6863\u4f5c\u4e3a\u5355\u4e2a KV \u5b58\u50a8\u65f6&#xff0c;<\/span><br \/>\n<span class=\"token comment\">\/\/ \u4efb\u4f55\u4fee\u6539\u90fd\u4f1a\u89e6\u53d1\u5168\u91cf\u540c\u6b65&#xff08;50KB \u6587\u6863\u540c\u6b65\u8017\u65f6 800ms&#xff09;\u3002<\/span><br \/>\n<span class=\"token comment\">\/\/ \u6309\u6bb5\u843d\u5206\u7247\u540e&#xff0c;\u53ea\u540c\u6b65\u53d8\u5316\u7684\u6bb5\u843d&#xff08;5KB&#xff09;&#xff0c;\u8017\u65f6\u964d\u5230 180ms\u3002<\/span><br \/>\n<span class=\"token keyword\">import<\/span> distributedData <span class=\"token keyword\">from<\/span> <span class=\"token string\">&#039;&#064;ohos.data.distributedData&#039;<\/span><span class=\"token punctuation\">;<\/span><\/p>\n<p><span class=\"token keyword\">export<\/span> <span class=\"token keyword\">class<\/span> <span class=\"token class-name\">DistributedSync<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n  <span class=\"token keyword\">private<\/span> kvStore<span class=\"token operator\">:<\/span> distributedData<span class=\"token punctuation\">.<\/span>KVStore <span class=\"token operator\">&#061;<\/span> <span class=\"token keyword\">null<\/span><br \/>\n  <span class=\"token keyword\">private<\/span> storeId<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span> <span class=\"token operator\">&#061;<\/span> <span class=\"token string\">&#039;notes_kv_store&#039;<\/span><\/p>\n<p>  <span class=\"token keyword\">async<\/span> <span class=\"token function\">init<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token operator\">:<\/span> <span class=\"token builtin\">Promise<\/span><span class=\"token operator\">&lt;<\/span><span class=\"token keyword\">void<\/span><span class=\"token operator\">&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token comment\">\/\/ \u521b\u5efa\u5206\u5e03\u5f0f KVStore<\/span><br \/>\n    <span class=\"token keyword\">const<\/span> config<span class=\"token operator\">:<\/span> distributedData<span class=\"token punctuation\">.<\/span>KVStoreConfig <span class=\"token operator\">&#061;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      createStore<span class=\"token operator\">:<\/span> <span class=\"token boolean\">false<\/span><span class=\"token punctuation\">,<\/span><br \/>\n      autoSync<span class=\"token operator\">:<\/span> <span class=\"token boolean\">true<\/span><span class=\"token punctuation\">,<\/span>  <span class=\"token comment\">\/\/ \u81ea\u52a8\u540c\u6b65\u6a21\u5f0f<\/span><br \/>\n      securityLevel<span class=\"token operator\">:<\/span> distributedData<span class=\"token punctuation\">.<\/span>SecurityLevel<span class=\"token punctuation\">.<\/span><span class=\"token constant\">S1<\/span><span class=\"token punctuation\">,<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token keyword\">const<\/span> manager <span class=\"token operator\">&#061;<\/span> distributedData<span class=\"token punctuation\">.<\/span><span class=\"token function\">createKVManager<\/span><span class=\"token punctuation\">(<\/span>config<span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>kvStore <span class=\"token operator\">&#061;<\/span> <span class=\"token keyword\">await<\/span> manager<span class=\"token punctuation\">.<\/span><span class=\"token function\">getKVStore<\/span><span class=\"token punctuation\">(<\/span><span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>storeId<span class=\"token punctuation\">,<\/span> config<span class=\"token punctuation\">)<\/span><\/p>\n<p>    <span class=\"token comment\">\/\/ \u76d1\u542c\u8fdc\u7a0b\u6570\u636e\u53d8\u66f4<\/span><br \/>\n    <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>kvStore<span class=\"token punctuation\">.<\/span><span class=\"token function\">on<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;dataChange&#039;<\/span><span class=\"token punctuation\">,<\/span> distributedData<span class=\"token punctuation\">.<\/span>SubscribeType<span class=\"token punctuation\">.<\/span><span class=\"token constant\">SUBSCRIBE_TYPE_REMOTE<\/span><span class=\"token punctuation\">,<\/span><br \/>\n      <span class=\"token punctuation\">(<\/span>data<span class=\"token operator\">:<\/span> distributedData<span class=\"token punctuation\">.<\/span>ChangeNotification<span class=\"token punctuation\">)<\/span> <span class=\"token operator\">&#061;&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n        <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">handleRemoteChange<\/span><span class=\"token punctuation\">(<\/span>data<span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><\/p>\n<p>  <span class=\"token comment\">\/\/ \u4fdd\u5b58\u6bb5\u843d\u5230\u5206\u5e03\u5f0f\u5b58\u50a8<\/span><br \/>\n  <span class=\"token keyword\">async<\/span> <span class=\"token function\">saveParagraph<\/span><span class=\"token punctuation\">(<\/span>noteId<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span><span class=\"token punctuation\">,<\/span> paraId<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span><span class=\"token punctuation\">,<\/span> content<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span><span class=\"token punctuation\">)<\/span><span class=\"token operator\">:<\/span> <span class=\"token builtin\">Promise<\/span><span class=\"token operator\">&lt;<\/span><span class=\"token keyword\">void<\/span><span class=\"token operator\">&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token keyword\">const<\/span> key <span class=\"token operator\">&#061;<\/span> <span class=\"token template-string\"><span class=\"token template-punctuation string\">&#096;<\/span><span class=\"token interpolation\"><span class=\"token interpolation-punctuation punctuation\">${<\/span>noteId<span class=\"token interpolation-punctuation punctuation\">}<\/span><\/span><span class=\"token string\">::<\/span><span class=\"token interpolation\"><span class=\"token interpolation-punctuation punctuation\">${<\/span>paraId<span class=\"token interpolation-punctuation punctuation\">}<\/span><\/span><span class=\"token template-punctuation string\">&#096;<\/span><\/span><br \/>\n    <span class=\"token keyword\">const<\/span> value<span class=\"token operator\">:<\/span> NoteParagraph <span class=\"token operator\">&#061;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      content<span class=\"token operator\">:<\/span> content<span class=\"token punctuation\">,<\/span><br \/>\n      version<span class=\"token operator\">:<\/span> Date<span class=\"token punctuation\">.<\/span><span class=\"token function\">now<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">,<\/span>  <span class=\"token comment\">\/\/ \u7528\u4e8e LWW \u51b2\u7a81\u89e3\u51b3<\/span><br \/>\n      deviceId<span class=\"token operator\">:<\/span> <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">getDeviceId<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">,<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token keyword\">await<\/span> <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>kvStore<span class=\"token punctuation\">.<\/span><span class=\"token function\">put<\/span><span class=\"token punctuation\">(<\/span>key<span class=\"token punctuation\">,<\/span> <span class=\"token constant\">JSON<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">stringify<\/span><span class=\"token punctuation\">(<\/span>value<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><\/p>\n<p>  <span class=\"token comment\">\/\/ \u5904\u7406\u8fdc\u7a0b\u53d8\u66f4<\/span><br \/>\n  <span class=\"token keyword\">private<\/span> <span class=\"token function\">handleRemoteChange<\/span><span class=\"token punctuation\">(<\/span>data<span class=\"token operator\">:<\/span> distributedData<span class=\"token punctuation\">.<\/span>ChangeNotification<span class=\"token punctuation\">)<\/span><span class=\"token operator\">:<\/span> <span class=\"token keyword\">void<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token keyword\">for<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token keyword\">const<\/span> entry <span class=\"token keyword\">of<\/span> data<span class=\"token punctuation\">.<\/span>insertEntries<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">applyRemoteParagraph<\/span><span class=\"token punctuation\">(<\/span>entry<span class=\"token punctuation\">.<\/span>key<span class=\"token punctuation\">,<\/span> entry<span class=\"token punctuation\">.<\/span>value<span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token keyword\">for<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token keyword\">const<\/span> entry <span class=\"token keyword\">of<\/span> data<span class=\"token punctuation\">.<\/span>updateEntries<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">applyRemoteParagraph<\/span><span class=\"token punctuation\">(<\/span>entry<span class=\"token punctuation\">.<\/span>key<span class=\"token punctuation\">,<\/span> entry<span class=\"token punctuation\">.<\/span>value<span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><br \/>\n<span class=\"token punctuation\">}<\/span><\/p>\n<hr \/>\n<h3>PC \u7aef\u7a97\u53e3\u4e0e\u517c\u5bb9\u6027\u9002\u914d<\/h3>\n<p>\u9e3f\u8499 PC \u548c\u624b\u673a\u7aef\u6700\u5927\u7684\u5dee\u5f02\u662f\u7a97\u53e3\u7ba1\u7406\u3002PC \u5e94\u7528\u8fd0\u884c\u5728\u7a97\u53e3\u5316\u73af\u5883\u4e2d&#xff0c;\u9700\u8981\u5904\u7406\u7a97\u53e3\u7f29\u653e\u3001\u591a\u7a97\u53e3\u3001\u952e\u76d8\u5feb\u6377\u952e\u7b49\u624b\u673a\u7aef\u4e0d\u9700\u8981\u7684\u95ee\u9898\u3002<\/p>\n<h4>4.1 \u7a97\u53e3\u751f\u547d\u5468\u671f\u9002\u914d<\/h4>\n<p><span class=\"token comment\">\/\/ EntryAbility.ets &#8211; \u5165\u53e3 Ability&#xff0c;\u5904\u7406\u7a97\u53e3\u751f\u547d\u5468\u671f<\/span><br \/>\n<span class=\"token keyword\">import<\/span> window <span class=\"token keyword\">from<\/span> <span class=\"token string\">&#039;&#064;ohos.window&#039;<\/span><span class=\"token punctuation\">;<\/span><\/p>\n<p><span class=\"token keyword\">export<\/span> <span class=\"token keyword\">default<\/span> <span class=\"token keyword\">class<\/span> <span class=\"token class-name\">EntryAbility<\/span> <span class=\"token keyword\">extends<\/span> <span class=\"token class-name\">UIAbility<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n  <span class=\"token keyword\">private<\/span> windowInstance<span class=\"token operator\">:<\/span> window<span class=\"token punctuation\">.<\/span>Window <span class=\"token operator\">&#061;<\/span> <span class=\"token keyword\">null<\/span><\/p>\n<p>  <span class=\"token function\">onWindowStageCreate<\/span><span class=\"token punctuation\">(<\/span>windowStage<span class=\"token operator\">:<\/span> window<span class=\"token punctuation\">.<\/span>WindowStage<span class=\"token punctuation\">)<\/span><span class=\"token operator\">:<\/span> <span class=\"token keyword\">void<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token comment\">\/\/ PC \u7aef\u8bbe\u7f6e\u7a97\u53e3\u6700\u5c0f\u5c3a\u5bf8&#xff0c;\u9632\u6b62\u7f29\u592a\u5c0f\u540e\u5e03\u5c40\u5d29\u6e83<\/span><br \/>\n    windowStage<span class=\"token punctuation\">.<\/span><span class=\"token function\">getMainWindow<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">then<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">(<\/span>win<span class=\"token punctuation\">)<\/span> <span class=\"token operator\">&#061;&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>windowInstance <span class=\"token operator\">&#061;<\/span> win<br \/>\n      win<span class=\"token punctuation\">.<\/span><span class=\"token function\">setMinimumWindowSize<\/span><span class=\"token punctuation\">(<\/span><span class=\"token number\">800<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token number\">500<\/span><span class=\"token punctuation\">)<\/span>  <span class=\"token comment\">\/\/ \u6700\u5c0f 800&#215;500<\/span><\/p>\n<p>      <span class=\"token comment\">\/\/ \u76d1\u542c\u7a97\u53e3\u5c3a\u5bf8\u53d8\u5316&#xff0c;\u505a\u54cd\u5e94\u5f0f\u5e03\u5c40<\/span><br \/>\n      win<span class=\"token punctuation\">.<\/span><span class=\"token function\">on<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;windowSizeChange&#039;<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">(<\/span>size<span class=\"token operator\">:<\/span> window<span class=\"token punctuation\">.<\/span>Size<span class=\"token punctuation\">)<\/span> <span class=\"token operator\">&#061;&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n        AppStorage<span class=\"token punctuation\">.<\/span><span class=\"token function\">setOrCreate<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;windowWidth&#039;<\/span><span class=\"token punctuation\">,<\/span> size<span class=\"token punctuation\">.<\/span>width<span class=\"token punctuation\">)<\/span><br \/>\n        AppStorage<span class=\"token punctuation\">.<\/span><span class=\"token function\">setOrCreate<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;windowHeight&#039;<\/span><span class=\"token punctuation\">,<\/span> size<span class=\"token punctuation\">.<\/span>height<span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token comment\">\/\/ \u5bbd\u5ea6 &lt; 1000 \u65f6\u5207\u6362\u4e3a\u5355\u680f\u5e03\u5c40<\/span><br \/>\n        AppStorage<span class=\"token punctuation\">.<\/span><span class=\"token function\">setOrCreate<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;isCompactMode&#039;<\/span><span class=\"token punctuation\">,<\/span> size<span class=\"token punctuation\">.<\/span>width <span class=\"token operator\">&lt;<\/span> <span class=\"token number\">1000<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><\/p>\n<p>    windowStage<span class=\"token punctuation\">.<\/span><span class=\"token function\">loadContent<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;pages\/Index&#039;<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">)<\/span> <span class=\"token operator\">&#061;&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">.<\/span>code<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n        hilog<span class=\"token punctuation\">.<\/span><span class=\"token function\">error<\/span><span class=\"token punctuation\">(<\/span><span class=\"token number\">0x0000<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token string\">&#039;EntryAbility&#039;<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token template-string\"><span class=\"token template-punctuation string\">&#096;<\/span><span class=\"token string\">\u52a0\u8f7d\u5931\u8d25: <\/span><span class=\"token interpolation\"><span class=\"token interpolation-punctuation punctuation\">${<\/span>err<span class=\"token punctuation\">.<\/span>message<span class=\"token interpolation-punctuation punctuation\">}<\/span><\/span><span class=\"token template-punctuation string\">&#096;<\/span><\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><br \/>\n<span class=\"token punctuation\">}<\/span><\/p>\n<h4>4.2 \u54cd\u5e94\u5f0f\u5e03\u5c40<\/h4>\n<p><span class=\"token comment\">\/\/ Index.ets &#8211; \u4e3b\u9875\u9762&#xff0c;\u6839\u636e\u7a97\u53e3\u5bbd\u5ea6\u5207\u6362\u5e03\u5c40<\/span><br \/>\n<span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">Entry<\/span><\/span><br \/>\n<span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">Component<\/span><\/span><br \/>\nstruct Index <span class=\"token punctuation\">{<\/span><br \/>\n  <span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">StorageLink<\/span><\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;isCompactMode&#039;<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token keyword\">private<\/span> isCompact<span class=\"token operator\">:<\/span> <span class=\"token builtin\">boolean<\/span> <span class=\"token operator\">&#061;<\/span> <span class=\"token boolean\">false<\/span><\/p>\n<p>  <span class=\"token function\">build<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>isCompact<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token comment\">\/\/ \u7a84\u7a97\u53e3&#xff1a;\u5355\u680f\u6a21\u5f0f&#xff0c;\u7f16\u8f91\u548c\u9884\u89c8\u5207\u6362\u663e\u793a<\/span><br \/>\n      <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">compactLayout<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">else<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token comment\">\/\/ \u5bbd\u7a97\u53e3&#xff1a;\u5206\u680f\u6a21\u5f0f&#xff0c;\u5de6\u7f16\u8f91\u53f3\u9884\u89c8<\/span><br \/>\n      <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">splitLayout<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><\/p>\n<p>  <span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">Builder<\/span><\/span> <span class=\"token function\">splitLayout<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token function\">Row<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token function\">EditorComponent<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token function\">Divider<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">vertical<\/span><span class=\"token punctuation\">(<\/span><span class=\"token boolean\">true<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">height<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;100%&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token function\">PreviewComponent<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token punctuation\">.<\/span><span class=\"token function\">width<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;100%&#039;<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">height<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;100%&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><\/p>\n<p>  <span class=\"token decorator\"><span class=\"token at operator\">&#064;<\/span><span class=\"token function\">Builder<\/span><\/span> <span class=\"token function\">compactLayout<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token comment\">\/\/ \u7528 Tab \u5207\u6362\u7f16\u8f91\/\u9884\u89c8<\/span><br \/>\n    <span class=\"token function\">Tabs<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token function\">TabContent<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span> <span class=\"token function\">EditorComponent<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">tabBar<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;\u7f16\u8f91&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n      <span class=\"token function\">TabContent<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span> <span class=\"token function\">PreviewComponent<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">tabBar<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;\u9884\u89c8&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token punctuation\">.<\/span><span class=\"token function\">width<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;100%&#039;<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">height<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;100%&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><br \/>\n<span class=\"token punctuation\">}<\/span><\/p>\n<h4>4.3 \u952e\u76d8\u5feb\u6377\u952e\u4f53\u7cfb<\/h4>\n<p>PC \u7aef\u7528\u6237\u91cd\u5ea6\u4f9d\u8d56\u5feb\u6377\u952e\u3002\u9e3f\u8499 PC \u901a\u8fc7 onKeyEvent \u76d1\u542c\u952e\u76d8\u4e8b\u4ef6&#xff1a;<\/p>\n<p><span class=\"token comment\">\/\/ \u5feb\u6377\u952e\u7ed1\u5b9a<\/span><br \/>\n<span class=\"token function\">TextArea<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">.<\/span><span class=\"token function\">onKeyEvent<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">(<\/span>event<span class=\"token operator\">:<\/span> KeyEvent<span class=\"token punctuation\">)<\/span> <span class=\"token operator\">&#061;&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>event<span class=\"token punctuation\">.<\/span>type <span class=\"token operator\">&#061;&#061;&#061;<\/span> KeyType<span class=\"token punctuation\">.<\/span>Down<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n      <span class=\"token keyword\">const<\/span> ctrl <span class=\"token operator\">&#061;<\/span> event<span class=\"token punctuation\">.<\/span>ctrlKey<br \/>\n      <span class=\"token keyword\">const<\/span> key <span class=\"token operator\">&#061;<\/span> event<span class=\"token punctuation\">.<\/span>keyCode<\/p>\n<p>      <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>ctrl <span class=\"token operator\">&amp;&amp;<\/span> key <span class=\"token operator\">&#061;&#061;&#061;<\/span> KeyCode<span class=\"token punctuation\">.<\/span><span class=\"token constant\">KEY_S<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n        <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">saveCurrentNote<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token keyword\">return<\/span> <span class=\"token boolean\">true<\/span>  <span class=\"token comment\">\/\/ \u6d88\u8d39\u4e8b\u4ef6&#xff0c;\u963b\u6b62\u9ed8\u8ba4\u884c\u4e3a<\/span><br \/>\n      <span class=\"token punctuation\">}<\/span><br \/>\n      <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>ctrl <span class=\"token operator\">&amp;&amp;<\/span> key <span class=\"token operator\">&#061;&#061;&#061;<\/span> KeyCode<span class=\"token punctuation\">.<\/span><span class=\"token constant\">KEY_B<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n        <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">wrapSelection<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;**&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token keyword\">return<\/span> <span class=\"token boolean\">true<\/span><br \/>\n      <span class=\"token punctuation\">}<\/span><br \/>\n      <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>ctrl <span class=\"token operator\">&amp;&amp;<\/span> key <span class=\"token operator\">&#061;&#061;&#061;<\/span> KeyCode<span class=\"token punctuation\">.<\/span><span class=\"token constant\">KEY_I<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n        <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">wrapSelection<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;*&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n        <span class=\"token keyword\">return<\/span> <span class=\"token boolean\">true<\/span><br \/>\n      <span class=\"token punctuation\">}<\/span><br \/>\n      <span class=\"token comment\">\/\/ &#8230; \u5176\u4ed6\u5feb\u6377\u952e<\/span><br \/>\n    <span class=\"token punctuation\">}<\/span><br \/>\n    <span class=\"token keyword\">return<\/span> <span class=\"token boolean\">false<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><\/p>\n<hr \/>\n<h3>\u5e94\u7528\u4e0a\u67b6\u8d44\u8d28\u51c6\u5907<\/h3>\n<p>\u4e0a\u67b6\u5e94\u7528\u5e02\u573a\u9700\u8981\u51c6\u5907\u4e00\u7cfb\u5217\u8d44\u8d28\u6750\u6599&#xff0c;\u8fd9\u4e00\u6b65\u770b\u4f3c\u662f\u6587\u6863\u5de5\u4f5c&#xff0c;\u4f46\u6750\u6599\u4e0d\u9f50\u4f1a\u88ab\u76f4\u63a5\u6253\u56de&#xff0c;\u4e0d\u8fdb\u5165\u5ba1\u6838\u6d41\u7a0b\u3002<\/p>\n<h4>5.1 \u8d44\u8d28\u6e05\u5355<\/h4>\n<table>\n<tr>\u6750\u6599\u8bf4\u660e\u8017\u65f6<\/tr>\n<tbody>\n<tr>\n<td>\u8f6f\u4ef6\u8457\u4f5c\u6743<\/td>\n<td>\u8f6f\u8457\u8bc1\u4e66\u6216\u7533\u8bf7\u53d7\u7406\u901a\u77e5\u4e66<\/td>\n<td>3 \u5929&#xff08;\u52a0\u6025&#xff09;<\/td>\n<\/tr>\n<tr>\n<td>\u9690\u79c1\u653f\u7b56<\/td>\n<td>\u5e94\u7528\u6743\u9650\u8bf4\u660e &#043; \u6570\u636e\u5904\u7406\u58f0\u660e<\/td>\n<td>1 \u5929<\/td>\n<\/tr>\n<tr>\n<td>\u7528\u6237\u534f\u8bae<\/td>\n<td>\u4f7f\u7528\u6761\u6b3e &#043; \u514d\u8d23\u58f0\u660e<\/td>\n<td>1 \u5929<\/td>\n<\/tr>\n<tr>\n<td>\u5e94\u7528\u56fe\u6807<\/td>\n<td>512&#215;512 PNG &#043; \u5706\u89d2\u5904\u7406<\/td>\n<td>0.5 \u5929<\/td>\n<\/tr>\n<tr>\n<td>\u5e94\u7528\u622a\u56fe<\/td>\n<td>\u81f3\u5c11 3 \u5f20&#xff0c;1920&#215;1080<\/td>\n<td>0.5 \u5929<\/td>\n<\/tr>\n<tr>\n<td>\u5e94\u7528\u63cf\u8ff0<\/td>\n<td>50-500 \u5b57\u529f\u80fd\u4ecb\u7ecd<\/td>\n<td>0.5 \u5929<\/td>\n<\/tr>\n<tr>\n<td>\u6d4b\u8bd5\u8d26\u53f7<\/td>\n<td>\u5982\u9700\u767b\u5f55\u5219\u63d0\u4f9b\u6d4b\u8bd5\u8d26\u53f7<\/td>\n<td>&#8211;<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h4>5.2 \u9690\u79c1\u653f\u7b56\u8981\u70b9<\/h4>\n<p>\u9690\u79c1\u653f\u7b56\u662f\u5ba1\u6838\u91cd\u70b9&#xff0c;\u5fc5\u987b\u5982\u5b9e\u58f0\u660e\u5e94\u7528\u4f7f\u7528\u7684\u6743\u9650\u548c\u6570\u636e\u5904\u7406\u65b9\u5f0f&#xff1a;<\/p>\n<p>\u300a\u5206\u5e03\u5f0f\u7b14\u8bb0\u9690\u79c1\u653f\u7b56\u300b\u6838\u5fc3\u6761\u6b3e&#xff1a;<\/p>\n<p>1. \u6570\u636e\u6536\u96c6\u8303\u56f4<br \/>\n   &#8211; \u672c\u5e94\u7528\u4ec5\u6536\u96c6\u60a8\u4e3b\u52a8\u8f93\u5165\u7684\u7b14\u8bb0\u5185\u5bb9<br \/>\n   &#8211; \u4e0d\u6536\u96c6\u8bbe\u5907\u6807\u8bc6\u7b26\u3001\u4f4d\u7f6e\u4fe1\u606f\u3001\u901a\u8baf\u5f55\u7b49\u654f\u611f\u6570\u636e<br \/>\n   &#8211; \u4e0d\u63a5\u5165\u4efb\u4f55\u7b2c\u4e09\u65b9 SDK<\/p>\n<p>2. \u6570\u636e\u5b58\u50a8\u4e0e\u540c\u6b65<br \/>\n   &#8211; \u7b14\u8bb0\u5185\u5bb9\u5b58\u50a8\u5728\u5e94\u7528\u6c99\u7bb1\u76ee\u5f55&#xff0c;\u4ec5\u60a8\u672c\u4eba\u53ef\u8bbf\u95ee<br \/>\n   &#8211; \u5206\u5e03\u5f0f\u540c\u6b65\u901a\u8fc7\u9e3f\u8499\u7cfb\u7edf\u5206\u5e03\u5f0f\u6570\u636e\u670d\u52a1\u5b8c\u6210<br \/>\n   &#8211; \u540c\u6b65\u6570\u636e\u5728\u8bbe\u5907\u95f4\u7aef\u5230\u7aef\u52a0\u5bc6\u4f20\u8f93&#xff0c;\u4e0d\u7ecf\u8fc7\u7b2c\u4e09\u65b9\u670d\u52a1\u5668<\/p>\n<p>3. \u6743\u9650\u4f7f\u7528\u8bf4\u660e<br \/>\n   &#8211; ohos.permission.DISTRIBUTED_DATASYNC&#xff1a;\u7528\u4e8e\u8de8\u8bbe\u5907\u7b14\u8bb0\u540c\u6b65<br \/>\n   &#8211; ohos.permission.FILE_ACCESS_USER_SELECTED&#xff1a;\u7528\u4e8e\u8bfb\u5199\u7528\u6237\u9009\u62e9\u7684\u6587\u4ef6<br \/>\n   &#8211; \u4ee5\u4e0a\u6743\u9650\u5747\u5728\u60a8\u4e3b\u52a8\u64cd\u4f5c\u65f6\u7533\u8bf7&#xff0c;\u4e0d\u540e\u53f0\u9759\u9ed8\u4f7f\u7528<\/p>\n<p>4. \u6570\u636e\u5220\u9664<br \/>\n   &#8211; \u60a8\u53ef\u968f\u65f6\u5728\u5e94\u7528\u5185\u5220\u9664\u7b14\u8bb0&#xff0c;\u6570\u636e\u5c06\u6c38\u4e45\u6e05\u9664<br \/>\n   &#8211; \u5378\u8f7d\u5e94\u7528\u540e&#xff0c;\u6240\u6709\u672c\u5730\u6570\u636e\u5c06\u81ea\u52a8\u5220\u9664<\/p>\n<h4>5.3 module.json5 \u6743\u9650\u58f0\u660e<\/h4>\n<p>{<br \/>\n  &#034;module&#034;: {<br \/>\n    &#034;requestPermissions&#034;: [<br \/>\n      {<br \/>\n        &#034;name&#034;: &#034;ohos.permission.DISTRIBUTED_DATASYNC&#034;,<br \/>\n        &#034;reason&#034;: &#034;$string:permission_distributed_reason&#034;,<br \/>\n        &#034;usedScene&#034;: {<br \/>\n          &#034;abilities&#034;: [&#034;EntryAbility&#034;],<br \/>\n          &#034;when&#034;: &#034;inuse&#034;<br \/>\n        }<br \/>\n      },<br \/>\n      {<br \/>\n        &#034;name&#034;: &#034;ohos.permission.FILE_ACCESS_USER_SELECTED&#034;,<br \/>\n        &#034;reason&#034;: &#034;$string:permission_file_reason&#034;,<br \/>\n        &#034;usedScene&#034;: {<br \/>\n          &#034;abilities&#034;: [&#034;EntryAbility&#034;],<br \/>\n          &#034;when&#034;: &#034;inuse&#034;<br \/>\n        }<br \/>\n      }<br \/>\n    ]<br \/>\n  }<br \/>\n}<\/p>\n<p>\u5173\u952e\u70b9&#xff1a;\u6bcf\u4e2a\u6743\u9650\u5fc5\u987b\u6709 reason \u8bf4\u660e\u4f7f\u7528\u76ee\u7684&#xff0c;when \u5fc5\u987b\u662f inuse&#xff08;\u4f7f\u7528\u65f6\u7533\u8bf7&#xff09;\u800c\u975e always&#xff08;\u540e\u53f0\u5e38\u9a7b&#xff09;&#xff0c;\u5426\u5219\u5ba1\u6838\u4f1a\u88ab\u62d2\u3002<\/p>\n<hr \/>\n<h3>\u5e94\u7528\u5e02\u573a\u5ba1\u6838\u8e29\u5751\u4e0e\u907f\u5751\u6280\u5de7<\/h3>\n<p>\u8fd9\u662f\u5168\u6587\u6700\u6838\u5fc3\u7684\u90e8\u5206\u3002\u6211\u7ecf\u5386\u4e86\u4e09\u8f6e\u5ba1\u6838&#xff0c;\u8bb0\u5f55\u6bcf\u6b21\u88ab\u62d2\u7684\u539f\u56e0\u548c\u4fee\u590d\u65b9\u6848\u3002<\/p>\n<h4>6.1 \u7b2c\u4e00\u8f6e\u88ab\u62d2&#xff1a;\u9690\u79c1\u653f\u7b56\u4e0d\u5408\u89c4<\/h4>\n<p>\u5ba1\u6838\u53cd\u9988&#xff1a;<\/p>\n<p>\u5ba1\u6838\u7ed3\u679c&#xff1a;\u4e0d\u901a\u8fc7<br \/>\n\u95ee\u9898\u9879 1&#xff1a;\u9690\u79c1\u653f\u7b56\u4e2d\u672a\u8bf4\u660e\u5206\u5e03\u5f0f\u540c\u6b65\u7684\u6570\u636e\u52a0\u5bc6\u65b9\u5f0f<br \/>\n\u95ee\u9898\u9879 2&#xff1a;\u6743\u9650 DISTRIBUTED_DATASYNC \u7684 reason \u63cf\u8ff0\u8fc7\u4e8e\u7b80\u7565<br \/>\n\u95ee\u9898\u9879 3&#xff1a;\u5e94\u7528\u63cf\u8ff0\u4e2d\u5305\u542b&#034;\u6700\u4f73&#034;\u5b57\u6837&#xff0c;\u8fdd\u53cd\u65b0\u5e7f\u544a\u6cd5<\/p>\n<p>\u4fee\u590d\u65b9\u6848&#xff1a;<\/p>\n<p>\u95ee\u9898 1&#xff1a;\u9690\u79c1\u653f\u7b56\u8865\u5145\u52a0\u5bc6\u65b9\u5f0f\u8bf4\u660e&#xff08;\u89c1 5.2 \u8282&#xff0c;\u589e\u52a0\u4e86&#034;\u7aef\u5230\u7aef\u52a0\u5bc6\u4f20\u8f93&#034;\u6761\u6b3e&#xff09;\u3002<\/p>\n<p>\u95ee\u9898 2&#xff1a;\u6743\u9650 reason \u4ece&#034;\u7528\u4e8e\u6570\u636e\u540c\u6b65&#034;\u6539\u4e3a\u5b8c\u6574\u63cf\u8ff0&#xff1a;<\/p>\n<p>{<br \/>\n  &#034;name&#034;: &#034;ohos.permission.DISTRIBUTED_DATASYNC&#034;,<br \/>\n  &#034;reason&#034;: &#034;$string:permission_distributed_reason&#034;<br \/>\n}<\/p>\n<p>\/\/ resources\/string.json<br \/>\n&#034;permission_distributed_reason&#034;: &#034;\u7528\u4e8e\u5728\u60a8\u7684\u9e3f\u8499\u8bbe\u5907\u95f4\u540c\u6b65\u7b14\u8bb0\u5185\u5bb9&#xff0c;&#034;<br \/>\n  &#034;\u6570\u636e\u901a\u8fc7\u7cfb\u7edf\u5206\u5e03\u5f0f\u6570\u636e\u670d\u52a1\u7aef\u5230\u7aef\u52a0\u5bc6\u4f20\u8f93&#xff0c;\u4e0d\u7ecf\u8fc7\u7b2c\u4e09\u65b9\u670d\u52a1\u5668&#034;<\/p>\n<p>\u95ee\u9898 3&#xff1a;\u5e94\u7528\u63cf\u8ff0\u628a&#034;\u9e3f\u8499 PC \u6700\u4f73 Markdown \u7f16\u8f91\u5668&#034;\u6539\u4e3a&#034;\u9e3f\u8499 PC \u7aef Markdown \u7f16\u8f91\u5668&#xff0c;\u652f\u6301\u5206\u5e03\u5f0f\u540c\u6b65&#034;\u3002<\/p>\n<p>\u7ecf\u9a8c&#xff1a;\u5ba1\u6838\u5bf9&#034;\u6700&#034;\u201c\u7b2c\u4e00\u201d&#034;\u6700\u4f73&#034;\u7b49\u7edd\u5bf9\u5316\u7528\u8bed\u96f6\u5bb9\u5fcd&#xff0c;\u63d0\u4ea4\u524d\u5168\u6587\u641c\u7d22\u8fd9\u4e9b\u8bcd\u3002<\/p>\n<h4>6.2 \u7b2c\u4e8c\u8f6e\u88ab\u62d2&#xff1a;\u529f\u80fd\u95ee\u9898\u4e0e\u5d29\u6e83<\/h4>\n<p>\u5ba1\u6838\u53cd\u9988&#xff1a;<\/p>\n<p>\u5ba1\u6838\u7ed3\u679c&#xff1a;\u4e0d\u901a\u8fc7<br \/>\n\u95ee\u9898\u9879 1&#xff1a;\u5728 PC \u7aef\u7a97\u53e3\u7f29\u653e\u5230\u6700\u5c0f\u5c3a\u5bf8\u65f6&#xff0c;\u7f16\u8f91\u533a\u5185\u5bb9\u88ab\u622a\u65ad\u4e0d\u53ef\u89c1<br \/>\n\u95ee\u9898\u9879 2&#xff1a;\u5206\u5e03\u5f0f\u540c\u6b65\u5f00\u5173\u5173\u95ed\u540e&#xff0c;\u4ecd\u540e\u53f0\u53d1\u8d77\u540c\u6b65\u8bf7\u6c42<br \/>\n\u95ee\u9898\u9879 3&#xff1a;\u6d4b\u8bd5\u673a\u4e0a\u62a5\u5d29\u6e83 1 \u6b21&#xff08;\u7a7a\u6307\u9488&#xff09;&#xff0c;\u5806\u6808\u5728 PreviewComponent:42<\/p>\n<p>\u4fee\u590d\u65b9\u6848&#xff1a;<\/p>\n<p>\u95ee\u9898 1&#xff1a;\u8bbe\u7f6e\u7a97\u53e3\u6700\u5c0f\u5c3a\u5bf8 800&#215;500&#xff08;\u89c1 4.1 \u8282&#xff09;&#xff0c;\u5e76\u5728\u5bbd\u5ea6 &lt; 1000 \u65f6\u5207\u6362\u4e3a\u5355\u680f Tab \u5e03\u5c40\u3002<\/p>\n<p>\u95ee\u9898 2&#xff1a;\u540c\u6b65\u5f00\u5173\u5173\u95ed\u65f6&#xff0c;\u53d6\u6d88 KVStore \u8ba2\u9605&#xff1a;<\/p>\n<p><span class=\"token comment\">\/\/ \u8bbe\u7f6e\u540c\u6b65\u5f00\u5173<\/span><br \/>\n<span class=\"token function\">setSyncEnabled<\/span><span class=\"token punctuation\">(<\/span>enabled<span class=\"token operator\">:<\/span> <span class=\"token builtin\">boolean<\/span><span class=\"token punctuation\">)<\/span><span class=\"token operator\">:<\/span> <span class=\"token keyword\">void<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n  <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>enabled<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>kvStore<span class=\"token punctuation\">.<\/span><span class=\"token function\">on<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;dataChange&#039;<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token operator\">&#8230;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">else<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token comment\">\/\/ \u5173\u95ed\u65f6\u5fc5\u987b\u53d6\u6d88\u8ba2\u9605&#xff0c;\u5426\u5219\u540e\u53f0\u4ecd\u4f1a\u6536\u5230\u540c\u6b65\u6570\u636e<\/span><br \/>\n    <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>kvStore<span class=\"token punctuation\">.<\/span><span class=\"token function\">off<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">&#039;dataChange&#039;<\/span><span class=\"token punctuation\">)<\/span><br \/>\n    <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>kvStore <span class=\"token operator\">&#061;<\/span> <span class=\"token keyword\">null<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><br \/>\n<span class=\"token punctuation\">}<\/span><\/p>\n<p>\u95ee\u9898 3&#xff1a;\u9884\u89c8\u7ec4\u4ef6\u7a7a\u6307\u9488\u5d29\u6e83&#xff0c;\u539f\u56e0\u662f AST \u8282\u70b9\u7684 children \u53ef\u80fd\u4e3a null \u4f46\u6e32\u67d3\u65f6\u672a\u5224\u7a7a&#xff1a;<\/p>\n<p><span class=\"token comment\">\/\/ \u4fee\u590d\u524d<\/span><br \/>\n<span class=\"token function\">Text<\/span><span class=\"token punctuation\">(<\/span><span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">renderInline<\/span><span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">.<\/span>children<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span><\/p>\n<p><span class=\"token comment\">\/\/ \u4fee\u590d\u540e<\/span><br \/>\n<span class=\"token function\">Text<\/span><span class=\"token punctuation\">(<\/span><span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">renderInline<\/span><span class=\"token punctuation\">(<\/span>node<span class=\"token punctuation\">.<\/span>children <span class=\"token operator\">??<\/span> <span class=\"token punctuation\">[<\/span><span class=\"token punctuation\">]<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span><\/p>\n<p>\u7ecf\u9a8c&#xff1a;\u5ba1\u6838\u4f1a\u5728\u591a\u79cd\u7a97\u53e3\u5c3a\u5bf8\u4e0b\u6d4b\u8bd5&#xff0c;\u5fc5\u987b\u5728 800&#215;500 \u5230 1920&#215;1080 \u5168\u5c3a\u5bf8\u8303\u56f4\u9a8c\u8bc1\u5e03\u5c40\u3002\u540c\u6b65\u7c7b\u529f\u80fd\u5fc5\u987b\u786e\u4fdd\u5f00\u5173\u53ef\u5b8c\u5168\u5173\u95ed&#xff0c;\u4e0d\u80fd\u6709\u540e\u53f0\u6b8b\u7559\u3002<\/p>\n<h4>6.3 \u7b2c\u4e09\u8f6e\u88ab\u62d2&#xff1a;\u517c\u5bb9\u6027\u4e0e\u7ec6\u8282<\/h4>\n<p>\u5ba1\u6838\u53cd\u9988&#xff1a;<\/p>\n<p>\u5ba1\u6838\u7ed3\u679c&#xff1a;\u4e0d\u901a\u8fc7<br \/>\n\u95ee\u9898\u9879 1&#xff1a;\u5728 HarmonyOS PC 4.1 \u7248\u672c\u4e0a\u542f\u52a8\u5d29\u6e83&#xff08;API 16 \u4e0d\u517c\u5bb9&#xff09;<br \/>\n\u95ee\u9898\u9879 2&#xff1a;\u5e94\u7528\u56fe\u6807\u5728\u6df1\u8272\u4e3b\u9898\u4e0b\u4e0d\u53ef\u89c1&#xff08;\u767d\u8272\u56fe\u6807\u65e0\u80cc\u666f&#xff09;<br \/>\n\u95ee\u9898\u9879 3&#xff1a;\u622a\u56fe\u4e0e\u5b9e\u9645\u5e94\u7528\u754c\u9762\u4e0d\u7b26&#xff08;\u622a\u56fe\u662f\u65e7\u7248\u672c&#xff09;<\/p>\n<p>\u4fee\u590d\u65b9\u6848&#xff1a;<\/p>\n<p>\u95ee\u9898 1&#xff1a;build-profile.json5 \u7684 compatibleSdkVersion \u4ece 18 \u6539\u4e3a 16&#xff0c;\u5e76\u5bf9 API 16 \u7f3a\u5c11\u7684\u80fd\u529b\u505a\u964d\u7ea7\u5904\u7406&#xff1a;<\/p>\n<p><span class=\"token comment\">\/\/ \u68c0\u67e5 API \u7248\u672c\u505a\u964d\u7ea7<\/span><br \/>\n<span class=\"token keyword\">import<\/span> deviceInfo <span class=\"token keyword\">from<\/span> <span class=\"token string\">&#039;&#064;ohos.deviceInfo&#039;<\/span><span class=\"token punctuation\">;<\/span><\/p>\n<p><span class=\"token keyword\">const<\/span> apiVersion <span class=\"token operator\">&#061;<\/span> deviceInfo<span class=\"token punctuation\">.<\/span>firstApiVersion<br \/>\n<span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>apiVersion <span class=\"token operator\">&gt;&#061;<\/span> <span class=\"token number\">18<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n  <span class=\"token comment\">\/\/ \u4f7f\u7528 API 18 \u7684\u7a97\u53e3\u6700\u5c0f\u5c3a\u5bf8 API<\/span><br \/>\n  win<span class=\"token punctuation\">.<\/span><span class=\"token function\">setMinimumWindowSize<\/span><span class=\"token punctuation\">(<\/span><span class=\"token number\">800<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token number\">500<\/span><span class=\"token punctuation\">)<\/span><br \/>\n<span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">else<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n  <span class=\"token comment\">\/\/ API 16 \u964d\u7ea7&#xff1a;\u4e0d\u8bbe\u7f6e\u6700\u5c0f\u5c3a\u5bf8&#xff0c;\u7528 CSS \u5a92\u4f53\u67e5\u8be2\u505a\u54cd\u5e94\u5f0f<\/span><br \/>\n<span class=\"token punctuation\">}<\/span><\/p>\n<p>\u95ee\u9898 2&#xff1a;\u5e94\u7528\u56fe\u6807\u6539\u4e3a\u5e26\u5706\u89d2\u80cc\u666f\u7684 SVG&#xff0c;\u660e\u6697\u4e3b\u9898\u4e0b\u90fd\u53ef\u89c1\u3002<\/p>\n<p>\u95ee\u9898 3&#xff1a;\u91cd\u65b0\u622a\u53d6\u5e94\u7528\u622a\u56fe&#xff0c;\u786e\u4fdd\u4e0e\u63d0\u4ea4\u7248\u672c\u5b8c\u5168\u4e00\u81f4\u3002<\/p>\n<p>\u7ecf\u9a8c&#xff1a;\u622a\u56fe\u5fc5\u987b\u5728\u6700\u7ec8\u7248\u672c\u4e0a\u91cd\u65b0\u622a\u53d6&#xff0c;\u4e0d\u80fd\u590d\u7528\u5f00\u53d1\u4e2d\u9014\u7684\u622a\u56fe\u3002\u517c\u5bb9\u7248\u672c\u8981\u5728\u771f\u673a\u4e0a\u6d4b\u8bd5&#xff0c;\u6a21\u62df\u5668\u53ef\u80fd\u65e0\u6cd5\u590d\u73b0\u5d29\u6e83\u3002<\/p>\n<h4>6.4 \u7b2c\u56db\u8f6e\u901a\u8fc7<\/h4>\n<p>\u524d\u4e09\u8f6e\u4fee\u590d\u540e&#xff0c;\u7b2c\u56db\u8f6e\u5ba1\u6838\u901a\u8fc7&#xff1a;<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2026\/10\/20261030161644-6ae4c2ecd8d99.png\" alt=\"\u5e94\u7528\u5e02\u573a\u5ba1\u6838\u901a\u8fc7\u622a\u56fe\" \/><\/p>\n<p>\u5ba1\u6838\u7ed3\u679c&#xff1a;\u901a\u8fc7<br \/>\n\u5ba1\u6838\u8017\u65f6&#xff1a;22 \u5929&#xff08;4 \u8f6e&#xff09;<br \/>\n\u5e94\u7528\u5927\u5c0f&#xff1a;8.7 MB<br \/>\n\u4e0a\u67b6\u7248\u672c&#xff1a;1.0.0<\/p>\n<h4>6.5 \u5ba1\u6838\u907f\u5751\u6280\u5de7\u6c47\u603b<\/h4>\n<p>#mermaid-svg-CkLn8VH4pIdDdVLg{font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-CkLn8VH4pIdDdVLg .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-CkLn8VH4pIdDdVLg .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-CkLn8VH4pIdDdVLg .error-icon{fill:#552222;}#mermaid-svg-CkLn8VH4pIdDdVLg .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-CkLn8VH4pIdDdVLg .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-CkLn8VH4pIdDdVLg .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-CkLn8VH4pIdDdVLg .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-CkLn8VH4pIdDdVLg .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-CkLn8VH4pIdDdVLg .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-CkLn8VH4pIdDdVLg .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-CkLn8VH4pIdDdVLg .marker{fill:#333333;stroke:#333333;}#mermaid-svg-CkLn8VH4pIdDdVLg .marker.cross{stroke:#333333;}#mermaid-svg-CkLn8VH4pIdDdVLg svg{font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-CkLn8VH4pIdDdVLg p{margin:0;}#mermaid-svg-CkLn8VH4pIdDdVLg .label{font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;color:#333;}#mermaid-svg-CkLn8VH4pIdDdVLg .cluster-label text{fill:#333;}#mermaid-svg-CkLn8VH4pIdDdVLg .cluster-label span{color:#333;}#mermaid-svg-CkLn8VH4pIdDdVLg .cluster-label span p{background-color:transparent;}#mermaid-svg-CkLn8VH4pIdDdVLg .label text,#mermaid-svg-CkLn8VH4pIdDdVLg span{fill:#333;color:#333;}#mermaid-svg-CkLn8VH4pIdDdVLg .node rect,#mermaid-svg-CkLn8VH4pIdDdVLg .node circle,#mermaid-svg-CkLn8VH4pIdDdVLg .node ellipse,#mermaid-svg-CkLn8VH4pIdDdVLg .node polygon,#mermaid-svg-CkLn8VH4pIdDdVLg .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-CkLn8VH4pIdDdVLg .rough-node .label text,#mermaid-svg-CkLn8VH4pIdDdVLg .node .label text,#mermaid-svg-CkLn8VH4pIdDdVLg .image-shape .label,#mermaid-svg-CkLn8VH4pIdDdVLg .icon-shape .label{text-anchor:middle;}#mermaid-svg-CkLn8VH4pIdDdVLg .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-CkLn8VH4pIdDdVLg .rough-node .label,#mermaid-svg-CkLn8VH4pIdDdVLg .node .label,#mermaid-svg-CkLn8VH4pIdDdVLg .image-shape .label,#mermaid-svg-CkLn8VH4pIdDdVLg .icon-shape .label{text-align:center;}#mermaid-svg-CkLn8VH4pIdDdVLg .node.clickable{cursor:pointer;}#mermaid-svg-CkLn8VH4pIdDdVLg .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-CkLn8VH4pIdDdVLg .arrowheadPath{fill:#333333;}#mermaid-svg-CkLn8VH4pIdDdVLg .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-CkLn8VH4pIdDdVLg .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-CkLn8VH4pIdDdVLg .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-CkLn8VH4pIdDdVLg .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-CkLn8VH4pIdDdVLg .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-CkLn8VH4pIdDdVLg .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-CkLn8VH4pIdDdVLg .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-CkLn8VH4pIdDdVLg .cluster text{fill:#333;}#mermaid-svg-CkLn8VH4pIdDdVLg .cluster span{color:#333;}#mermaid-svg-CkLn8VH4pIdDdVLg div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-CkLn8VH4pIdDdVLg .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-CkLn8VH4pIdDdVLg rect.text{fill:none;stroke-width:0;}#mermaid-svg-CkLn8VH4pIdDdVLg .icon-shape,#mermaid-svg-CkLn8VH4pIdDdVLg .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-CkLn8VH4pIdDdVLg .icon-shape p,#mermaid-svg-CkLn8VH4pIdDdVLg .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-CkLn8VH4pIdDdVLg .icon-shape .label rect,#mermaid-svg-CkLn8VH4pIdDdVLg .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-CkLn8VH4pIdDdVLg .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-CkLn8VH4pIdDdVLg .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-CkLn8VH4pIdDdVLg :root{&#8211;mermaid-font-family:\\&#8221;trebuchet ms\\&#8221;,verdana,arial,sans-serif;}<span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"edgeLabel\"><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u63d0\u4ea4\u5ba1\u6838\u524d\u81ea\u68c0<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u6587\u6848\u68c0\u67e5<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u529f\u80fd\u68c0\u67e5<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u517c\u5bb9\u6027\u68c0\u67e5<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u8d44\u8d28\u68c0\u67e5<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u641c\u7d22\u7edd\u5bf9\u5316\u7528\u8bed\u6700\/\u7b2c\u4e00\/\u6700\u4f73<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u9690\u79c1\u653f\u7b56\u4e0e\u5b9e\u9645\u6743\u9650\u4e00\u81f4<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u5168\u7a97\u53e3\u5c3a\u5bf8\u6d4b\u8bd5<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u5f00\u5173\u529f\u80fd\u53ef\u5b8c\u5168\u5173\u95ed<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u65e0\u7a7a\u6307\u9488\/\u5d29\u6e83<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u6700\u4f4e\u517c\u5bb9\u7248\u672c\u771f\u673a\u6d4b\u8bd5<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u6df1\u8272\u4e3b\u9898\u56fe\u6807\u53ef\u89c1<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u622a\u56fe\u4e0e\u6700\u7ec8\u7248\u672c\u4e00\u81f4<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u8f6f\u8457\u8bc1\u4e66\u6709\u6548<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u6743\u9650 reason \u5b8c\u6574<\/p>\n<p><\/span><span class=\"nodeLabel\"><\/p>\n<p>\u63d0\u4ea4<\/p>\n<p><\/span><\/p>\n<hr \/>\n<h3>\u5206\u5e03\u5f0f\u7279\u6027\u8c03\u8bd5<\/h3>\n<p>\u5206\u5e03\u5f0f\u540c\u6b65\u662f\u5e94\u7528\u7684\u6838\u5fc3\u80fd\u529b&#xff0c;\u4e5f\u662f\u8c03\u8bd5\u6700\u56f0\u96be\u7684\u90e8\u5206\u2014\u2014\u9700\u8981\u591a\u8bbe\u5907\u73af\u5883&#xff0c;\u4e14\u540c\u6b65\u65f6\u5e8f\u4e0d\u6613\u590d\u73b0\u3002<\/p>\n<h4>7.1 \u591a\u8bbe\u5907\u8c03\u8bd5\u73af\u5883\u642d\u5efa<\/h4>\n<p>DevEco Studio \u652f\u6301\u540c\u65f6\u8fde\u63a5\u591a\u53f0\u8bbe\u5907\u8c03\u8bd5\u3002\u6211\u7528\u4e86 1 \u53f0\u9e3f\u8499 PC &#043; 1 \u53f0\u9e3f\u8499\u624b\u673a\u642d\u5efa\u8c03\u8bd5\u73af\u5883&#xff1a;<\/p>\n<p><span class=\"token comment\"># \u67e5\u770b\u5df2\u8fde\u63a5\u8bbe\u5907<\/span><br \/>\nhdc list targets<br \/>\n<span class=\"token comment\"># \u8f93\u51fa:<\/span><br \/>\n<span class=\"token comment\">#   192.168.1.108:5555  (PC)<\/span><br \/>\n<span class=\"token comment\">#   192.168.1.233:5555  (Phone)<\/span><\/p>\n<p><span class=\"token comment\"># \u540c\u65f6\u5b89\u88c5\u5230\u4e24\u53f0\u8bbe\u5907<\/span><br \/>\nhdc <span class=\"token function\">install<\/span> <span class=\"token parameter variable\">-s<\/span> <span class=\"token number\">192.168<\/span>.1.108:5555 entry-default-signed.hap<br \/>\nhdc <span class=\"token function\">install<\/span> <span class=\"token parameter variable\">-s<\/span> <span class=\"token number\">192.168<\/span>.1.233:5555 entry-default-signed.hap<\/p>\n<p><span class=\"token comment\"># \u67e5\u770b\u5206\u5e03\u5f0f\u540c\u6b65\u65e5\u5fd7<\/span><br \/>\nhdc shell hilog <span class=\"token operator\">|<\/span> <span class=\"token function\">grep<\/span> <span class=\"token parameter variable\">-E<\/span> <span class=\"token string\">&#034;distributedData|KVStore&#034;<\/span><\/p>\n<h4>7.2 \u540c\u6b65\u5ef6\u8fdf\u5b9e\u6d4b<\/h4>\n<p>\u5728 PC \u7aef\u7f16\u8f91\u4e00\u4e2a\u6bb5\u843d&#xff0c;\u6d4b\u91cf\u624b\u673a\u7aef\u6536\u5230\u540c\u6b65\u6570\u636e\u7684\u5ef6\u8fdf&#xff1a;<\/p>\n<table>\n<tr>\u573a\u666f\u540c\u6b65\u5ef6\u8fdf\u8bf4\u660e<\/tr>\n<tbody>\n<tr>\n<td>\u540c WiFi&#xff0c;\u5c0f\u6bb5\u843d (1KB)<\/td>\n<td>180ms<\/td>\n<td>\u6b63\u5e38\u573a\u666f<\/td>\n<\/tr>\n<tr>\n<td>\u540c WiFi&#xff0c;\u5927\u6bb5\u843d (50KB)<\/td>\n<td>680ms<\/td>\n<td>\u6574\u7bc7\u540c\u6b65&#xff0c;\u5df2\u4f18\u5316\u4e3a\u5206\u7247<\/td>\n<\/tr>\n<tr>\n<td>\u540c WiFi&#xff0c;\u5206\u7247\u540e (5KB)<\/td>\n<td>210ms<\/td>\n<td>\u6309\u6bb5\u843d\u5206\u7247\u540c\u6b65<\/td>\n<\/tr>\n<tr>\n<td>\u8de8\u7f51\u7edc (\u4e0d\u540c WiFi)<\/td>\n<td>1200ms<\/td>\n<td>\u7ecf\u8fc7\u4e91\u7aef\u4e2d\u8f6c<\/td>\n<\/tr>\n<tr>\n<td>\u79bb\u7ebf\u540e\u4e0a\u7ebf<\/td>\n<td>3.2s<\/td>\n<td>\u8865\u507f\u540c\u6b65\u5168\u91cf\u6570\u636e<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p><img decoding=\"async\" src=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2026\/10\/20261030161645-6ae4c2ed375e1.png\" alt=\"\u5206\u5e03\u5f0f\u540c\u6b65\u5b9e\u6d4b\u622a\u56fe\" \/><\/p>\n<hr \/>\n<h3>\u5f00\u53d1\u8fc7\u7a0b\u8e29\u5751\u603b\u7ed3<\/h3>\n<p>\u9664\u4e86\u5ba1\u6838\u88ab\u62d2\u7684\u95ee\u9898&#xff0c;\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u8fd8\u6709\u51e0\u4e2a\u503c\u5f97\u8bb0\u5f55\u7684\u5751\u3002<\/p>\n<h4>8.1 \u8e29\u5751\u4e00&#xff1a;\u5206\u5e03\u5f0f\u6570\u636e\u51b2\u7a81&#xff0c;\u540e\u5199\u8986\u76d6\u5148\u5199\u4f46\u7248\u672c\u53f7\u4e22\u5931<\/h4>\n<p>\u73b0\u8c61&#xff1a;PC \u548c\u624b\u673a\u540c\u65f6\u7f16\u8f91\u540c\u4e00\u6bb5\u843d&#xff0c;\u540c\u6b65\u540e\u53d1\u73b0\u4e00\u8fb9\u7684\u4fee\u6539\u4e22\u5931\u4e86\u3002<\/p>\n<p>\u539f\u56e0&#xff1a;\u5206\u5e03\u5f0f\u6570\u636e\u670d\u52a1\u7684\u9ed8\u8ba4\u51b2\u7a81\u89e3\u51b3\u7b56\u7565\u662f LWW&#xff08;Last Write Wins&#xff09;&#xff0c;\u57fa\u4e8e\u6570\u636e\u7684\u7cfb\u7edf\u65f6\u95f4\u6233\u3002\u4f46 PC \u548c\u624b\u673a\u7684\u7cfb\u7edf\u65f6\u95f4\u53ef\u80fd\u4e0d\u540c\u6b65&#xff0c;\u5bfc\u81f4\u65f6\u95f4\u6233\u5224\u65ad\u4e0d\u51c6\u3002<\/p>\n<p>\u89e3\u51b3\u65b9\u6848&#xff1a;\u5728 value \u4e2d\u643a\u5e26\u5e94\u7528\u5c42\u7248\u672c\u53f7&#xff08;Date.now() &#043; \u8bbe\u5907 ID \u504f\u79fb&#xff09;&#xff0c;\u624b\u52a8\u5b9e\u73b0\u51b2\u7a81\u89e3\u51b3&#xff1a;<\/p>\n<p><span class=\"token keyword\">private<\/span> <span class=\"token function\">applyRemoteParagraph<\/span><span class=\"token punctuation\">(<\/span>key<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span><span class=\"token punctuation\">,<\/span> valueStr<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span><span class=\"token punctuation\">)<\/span><span class=\"token operator\">:<\/span> <span class=\"token keyword\">void<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n  <span class=\"token keyword\">const<\/span> remote<span class=\"token operator\">:<\/span> NoteParagraph <span class=\"token operator\">&#061;<\/span> <span class=\"token constant\">JSON<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">parse<\/span><span class=\"token punctuation\">(<\/span>valueStr<span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token keyword\">const<\/span> local <span class=\"token operator\">&#061;<\/span> <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>localCache<span class=\"token punctuation\">.<\/span><span class=\"token function\">get<\/span><span class=\"token punctuation\">(<\/span>key<span class=\"token punctuation\">)<\/span><\/p>\n<p>  <span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>local <span class=\"token operator\">&amp;&amp;<\/span> remote<span class=\"token punctuation\">.<\/span>version <span class=\"token operator\">&lt;&#061;<\/span> local<span class=\"token punctuation\">.<\/span>version<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token comment\">\/\/ \u8fdc\u7a0b\u7248\u672c\u66f4\u65e7&#xff0c;\u4e22\u5f03<\/span><br \/>\n    <span class=\"token keyword\">return<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><br \/>\n  <span class=\"token comment\">\/\/ \u8fdc\u7a0b\u7248\u672c\u66f4\u65b0&#xff0c;\u5e94\u7528\u53d8\u66f4<\/span><br \/>\n  <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span>localCache<span class=\"token punctuation\">.<\/span><span class=\"token function\">set<\/span><span class=\"token punctuation\">(<\/span>key<span class=\"token punctuation\">,<\/span> remote<span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">notifyEditorUpdate<\/span><span class=\"token punctuation\">(<\/span>key<span class=\"token punctuation\">,<\/span> remote<span class=\"token punctuation\">.<\/span>content<span class=\"token punctuation\">)<\/span><br \/>\n<span class=\"token punctuation\">}<\/span><\/p>\n<h4>8.2 \u8e29\u5751\u4e8c&#xff1a;TextArea \u5728 PC \u7aef\u4e2d\u6587\u8f93\u5165\u6cd5\u91cd\u590d\u89e6\u53d1 onChange<\/h4>\n<p>\u73b0\u8c61&#xff1a;\u7528\u62fc\u97f3\u8f93\u5165\u6cd5\u6253\u4e2d\u6587\u65f6&#xff0c;onChange \u88ab\u91cd\u590d\u89e6\u53d1&#xff0c;\u5bfc\u81f4\u89e3\u6790\u5668\u6536\u5230\u4e2d\u95f4\u6001\u6587\u672c&#xff08;\u5982&#034;ni hao&#034;\u2192&#034;\u4f60\u597d&#034;\u8fc7\u7a0b\u4e2d\u89e6\u53d1\u591a\u6b21&#xff09;\u3002<\/p>\n<p>\u539f\u56e0&#xff1a;\u9e3f\u8499 PC \u7684 TextArea \u5728\u8f93\u5165\u6cd5\u7ec4\u5408\u6001\u65f6\u4f1a\u89e6\u53d1 onChange&#xff0c;\u4f20\u5165\u7684\u662f\u4e2d\u95f4\u6001\u6587\u672c\u3002<\/p>\n<p>\u89e3\u51b3\u65b9\u6848&#xff1a;\u7528 onTextChange \u66ff\u4ee3 onChange&#xff0c;onTextChange \u53ea\u5728\u8f93\u5165\u6cd5\u63d0\u4ea4\u540e\u89e6\u53d1&#xff1a;<\/p>\n<p><span class=\"token function\">TextArea<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token comment\">\/\/ \u9519\u8bef&#xff1a;onChange \u5728\u8f93\u5165\u6cd5\u7ec4\u5408\u6001\u91cd\u590d\u89e6\u53d1<\/span><br \/>\n  <span class=\"token comment\">\/\/ .onChange((value: string) &#061;&gt; { &#8230; })<\/span><\/p>\n<p>  <span class=\"token comment\">\/\/ \u6b63\u786e&#xff1a;onTextChange \u53ea\u5728\u63d0\u4ea4\u540e\u89e6\u53d1<\/span><br \/>\n  <span class=\"token punctuation\">.<\/span><span class=\"token function\">onTextChange<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">(<\/span>value<span class=\"token operator\">:<\/span> <span class=\"token builtin\">string<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">&#061;&gt;<\/span> <span class=\"token punctuation\">{<\/span><br \/>\n    <span class=\"token keyword\">this<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">handleTextChange<\/span><span class=\"token punctuation\">(<\/span>value<span class=\"token punctuation\">)<\/span><br \/>\n  <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><\/p>\n<h4>8.3 \u8e29\u5751\u4e09&#xff1a;\u7a97\u53e3\u6700\u5c0f\u5c3a\u5bf8\u8bbe\u7f6e\u5728 API 16 \u4e0a\u5d29\u6e83<\/h4>\n<p>\u73b0\u8c61&#xff1a;\u8c03\u7528 win.setMinimumWindowSize(800, 500) \u5728 HarmonyOS PC 4.1 \u4e0a\u62a5 function not found \u5d29\u6e83\u3002<\/p>\n<p>\u539f\u56e0&#xff1a;setMinimumWindowSize \u662f API 18 \u65b0\u589e\u63a5\u53e3&#xff0c;API 16 \u4e0d\u5b58\u5728\u3002<\/p>\n<p>\u89e3\u51b3\u65b9\u6848&#xff1a;\u8fd0\u884c\u65f6\u68c0\u67e5 API \u7248\u672c\u505a\u964d\u7ea7&#xff08;\u89c1 6.3 \u8282\u95ee\u9898 1 \u7684\u4fee\u590d&#xff09;\u3002<\/p>\n<p>\u7ecf\u9a8c&#xff1a;PC \u4e13\u5c5e API \u666e\u904d\u4ece API 18 \u5f00\u59cb\u5f15\u5165&#xff0c;\u5982\u679c\u517c\u5bb9\u7248\u672c\u4f4e\u4e8e 18&#xff0c;\u6240\u6709 PC \u4e13\u5c5e\u63a5\u53e3\u90fd\u8981\u505a\u7248\u672c\u5224\u65ad\u3002<\/p>\n<h4>8.4 \u8e29\u5751\u56db&#xff1a;\u5e94\u7528\u56fe\u6807\u5706\u89d2\u5904\u7406\u4e0d\u4e00\u81f4<\/h4>\n<p>\u73b0\u8c61&#xff1a;\u5e94\u7528\u56fe\u6807\u5728\u684c\u9762\u4e0a\u663e\u793a\u6709\u5706\u89d2&#xff0c;\u4f46\u5728\u5e94\u7528\u5e02\u573a\u8be6\u60c5\u9875\u663e\u793a\u4e3a\u76f4\u89d2&#xff0c;\u5ba1\u6838\u53cd\u9988&#034;\u56fe\u6807\u4e0d\u89c4\u8303&#034;\u3002<\/p>\n<p>\u539f\u56e0&#xff1a;\u9e3f\u8499\u684c\u9762\u4f1a\u81ea\u52a8\u7ed9\u56fe\u6807\u52a0\u5706\u89d2\u906e\u7f69&#xff0c;\u4f46\u5e94\u7528\u5e02\u573a\u8be6\u60c5\u9875\u663e\u793a\u539f\u56fe\u3002\u5982\u679c\u56fe\u6807\u672c\u8eab\u6709\u5706\u89d2&#xff0c;\u53e0\u52a0\u540e\u4f1a\u51fa\u73b0\u53cc\u91cd\u5706\u89d2\u3002<\/p>\n<p>\u89e3\u51b3\u65b9\u6848&#xff1a;\u56fe\u6807\u8bbe\u8ba1\u4e3a\u76f4\u89d2\u65b9\u5f62&#xff0c;\u8ba9\u7cfb\u7edf\u7edf\u4e00\u52a0\u5706\u89d2\u906e\u7f69\u3002\u4e0d\u8981\u5728\u56fe\u6807\u91cc\u81ea\u5df1\u753b\u5706\u89d2\u3002<\/p>\n<hr \/>\n<h3>\u4e0a\u67b6\u540e\u4f18\u5316\u8fed\u4ee3<\/h3>\n<p>\u5e94\u7528\u4e0a\u67b6\u540e&#xff0c;\u6839\u636e\u7528\u6237\u53cd\u9988\u505a\u4e86\u4e24\u8f6e\u4f18\u5316\u8fed\u4ee3\u3002<\/p>\n<h4>9.1 v1.0.1 \u4fee\u590d&#xff08;\u4e0a\u67b6\u540e\u7b2c 3 \u5929&#xff09;<\/h4>\n<table>\n<tr>\u95ee\u9898\u4f18\u5148\u7ea7\u4fee\u590d\u65b9\u5f0f<\/tr>\n<tbody>\n<tr>\n<td>\u5927\u6587\u4ef6 (&gt;10\u4e07\u5b57) \u7f16\u8f91\u5361\u987f<\/td>\n<td>P0<\/td>\n<td>\u589e\u91cf\u89e3\u6790\u4f18\u5316&#xff0c;\u865a\u62df\u6eda\u52a8<\/td>\n<\/tr>\n<tr>\n<td>\u5bfc\u51fa PDF \u4e2d\u6587\u4e71\u7801<\/td>\n<td>P0<\/td>\n<td>\u5d4c\u5165\u4e2d\u6587\u5b57\u4f53\u5b50\u96c6<\/td>\n<\/tr>\n<tr>\n<td>\u5feb\u6377\u952e Ctrl&#043;Z \u64a4\u9500\u4e0d\u5de5\u4f5c<\/td>\n<td>P1<\/td>\n<td>\u63a5\u5165\u7cfb\u7edf UndoManager<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h4>9.2 v1.1.0 \u529f\u80fd\u66f4\u65b0&#xff08;\u4e0a\u67b6\u540e\u7b2c 14 \u5929&#xff09;<\/h4>\n<ul>\n<li>\u4ee3\u7801\u5757\u8bed\u6cd5\u9ad8\u4eae&#xff08;\u652f\u6301 20&#043; \u8bed\u8a00&#xff09;<\/li>\n<li>\u76ee\u5f55\u6811\u591a\u6587\u4ef6\u7ba1\u7406<\/li>\n<li>\u5bfc\u51fa HTML<\/li>\n<li>\u81ea\u5b9a\u4e49 CSS \u4e3b\u9898<\/li>\n<\/ul>\n<h4>9.3 \u8fd0\u8425\u6570\u636e<\/h4>\n<p>\u4e0a\u67b6 30 \u5929\u540e\u7684\u6570\u636e&#xff1a;<\/p>\n<p>\u4e0b\u8f7d\u91cf:        4,200 \u6b21<br \/>\n\u65e5\u6d3b\u7528\u6237:      380<br \/>\n\u8bc4\u5206:          4.6 \/ 5.0<br \/>\n\u4e3b\u8981\u53cd\u9988:      &#034;\u7ec8\u4e8e\u6709\u80fd\u7528\u7684 Markdown \u7f16\u8f91\u5668\u4e86&#034;&#xff08;\u597d\u8bc4&#xff09;<br \/>\n              &#034;\u5e0c\u671b\u652f\u6301 Mermaid \u56fe\u8868&#034;&#xff08;\u529f\u80fd\u5efa\u8bae&#xff09;<br \/>\n              &#034;\u5206\u5e03\u5f0f\u540c\u6b65\u5f88\u60ca\u8273&#034;&#xff08;\u597d\u8bc4&#xff09;<\/p>\n<p>\u5d29\u6e83\u7387:        0.03%<br \/>\nANR \u7387:        0.01%<br \/>\n\u540c\u6b65\u6210\u529f\u7387:    99.7%<\/p>\n<hr \/>\n<h3>\u5c0f\u7ed3&#xff1a;PC \u7aef\u4e0a\u67b6\u7684\u5173\u952e\u6536\u83b7<\/h3>\n<h4>10.1 \u6838\u5fc3\u7ed3\u8bba<\/h4>\n<p>\u8fd9\u6b3e\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u5e94\u7528\u4ece\u7acb\u9879\u5230\u4e0a\u67b6\u5386\u65f6 35 \u5929&#xff08;\u5f00\u53d1 13 \u5929 &#043; \u5ba1\u6838 22 \u5929&#xff09;&#xff0c;\u6700\u7ec8\u4e0a\u67b6\u540e 30 \u5929\u4e0b\u8f7d 4200 \u6b21&#xff0c;\u8bc4\u5206 4.6 \u661f\u3002\u51e0\u4e2a\u5173\u952e\u6536\u83b7&#xff1a;<\/p>\n<ul>\n<li>\u5ba1\u6838\u662f\u6700\u4e0d\u53ef\u63a7\u7684\u73af\u8282&#xff1a;\u5f00\u53d1 13 \u5929&#xff0c;\u5ba1\u6838\u82b1\u4e86 22 \u5929&#xff0c;4 \u8f6e\u624d\u8fc7\u3002\u63d0\u524d\u5bf9\u7167\u5ba1\u6838\u89c4\u8303\u81ea\u68c0&#xff0c;\u80fd\u5927\u5e45\u51cf\u5c11\u88ab\u62d2\u8f6e\u6b21<\/li>\n<li>\u5206\u5e03\u5f0f\u80fd\u529b\u662f\u5dee\u5f02\u5316\u5356\u70b9&#xff1a;\u7528\u6237\u53cd\u9988\u4e2d&#034;\u5206\u5e03\u5f0f\u540c\u6b65&#034;\u662f\u63d0\u53ca\u6700\u591a\u7684\u597d\u8bc4\u70b9&#xff0c;\u9e3f\u8499 PC \u5e94\u7528\u8981\u5145\u5206\u5229\u7528\u8fd9\u4e2a\u5e73\u53f0\u4f18\u52bf<\/li>\n<li>PC \u9002\u914d\u4e0d\u662f\u53ef\u9009\u9879&#xff1a;\u7a97\u53e3\u7ba1\u7406\u3001\u5feb\u6377\u952e\u3001\u54cd\u5e94\u5f0f\u5e03\u5c40\u8fd9\u4e9b PC \u4e13\u5c5e\u80fd\u529b\u4e0d\u505a\u7684\u8bdd\u7528\u6237\u4f53\u9a8c\u76f4\u63a5\u4e0d\u53ca\u683c<\/li>\n<\/ul>\n<h4>10.2 \u4e0a\u67b6\u6d41\u7a0b\u6c89\u6dc0<\/h4>\n<p>\u7ecf\u8fc7\u8fd9\u6b21\u5b8c\u6574\u6d41\u7a0b&#xff0c;\u6211\u6c89\u6dc0\u4e86\u4e00\u5957\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6 checklist&#xff1a;<\/p>\n<li>\u5f00\u53d1\u9636\u6bb5&#xff1a;\u5168\u7a97\u53e3\u5c3a\u5bf8\u6d4b\u8bd5 &#043; \u6700\u4f4e\u517c\u5bb9\u7248\u672c\u771f\u673a\u9a8c\u8bc1 &#043; \u8f93\u5165\u6cd5\u7ec4\u5408\u6001\u6d4b\u8bd5<\/li>\n<li>\u8d44\u8d28\u9636\u6bb5&#xff1a;\u8f6f\u8457 &#043; \u9690\u79c1\u653f\u7b56 &#043; \u7528\u6237\u534f\u8bae &#043; \u56fe\u6807\u622a\u56fe&#xff08;\u622a\u56fe\u5fc5\u987b\u6700\u7ec8\u7248\u672c\u91cd\u622a&#xff09;<\/li>\n<li>\u81ea\u68c0\u9636\u6bb5&#xff1a;\u7edd\u5bf9\u5316\u7528\u8bed\u641c\u7d22 &#043; \u6743\u9650 reason \u5b8c\u6574\u6027 &#043; \u5f00\u5173\u529f\u80fd\u53ef\u5b8c\u5168\u5173\u95ed<\/li>\n<li>\u63d0\u4ea4\u9636\u6bb5&#xff1a;\u7248\u672c\u53f7 &#043; \u66f4\u65b0\u65e5\u5fd7 &#043; \u6d4b\u8bd5\u8d26\u53f7&#xff08;\u5982\u9700\u767b\u5f55&#xff09;<\/li>\n<h4>10.3 \u7ed9\u5f00\u53d1\u8005\u7684\u5efa\u8bae<\/h4>\n<p>\u5982\u679c\u4f60\u4e5f\u5728\u5f00\u53d1\u9e3f\u8499 PC \u5e94\u7528\u51c6\u5907\u4e0a\u67b6&#xff0c;\u6211\u7684\u5efa\u8bae&#xff1a;<\/p>\n<li>\u5148\u628a\u5ba1\u6838\u89c4\u8303\u901a\u8bfb\u4e00\u904d&#xff0c;\u5f88\u591a\u88ab\u62d2\u539f\u56e0&#xff08;\u7edd\u5bf9\u5316\u7528\u8bed\u3001\u6743\u9650 reason&#xff09;\u5728\u89c4\u8303\u91cc\u660e\u786e\u5199\u4e86&#xff0c;\u4f46\u5bb9\u6613\u5ffd\u7565<\/li>\n<li>\u622a\u56fe\u5728\u6700\u7ec8\u7248\u672c\u4e0a\u622a&#xff0c;\u4e0d\u8981\u590d\u7528\u5f00\u53d1\u4e2d\u9014\u7684\u622a\u56fe&#xff0c;\u8fd9\u662f\u6700\u5e38\u89c1\u7684\u88ab\u62d2\u539f\u56e0\u4e4b\u4e00<\/li>\n<li>\u517c\u5bb9\u7248\u672c\u771f\u673a\u6d4b\u8bd5&#xff0c;\u6a21\u62df\u5668\u65e0\u6cd5\u590d\u73b0\u6240\u6709\u5d29\u6e83&#xff0c;\u81f3\u5c11\u5728\u6700\u4f4e\u517c\u5bb9\u7248\u672c\u7684\u771f\u673a\u4e0a\u8dd1\u4e00\u904d<\/li>\n<li>\u5206\u5e03\u5f0f\u529f\u80fd\u786e\u4fdd\u53ef\u5173\u95ed&#xff0c;\u5ba1\u6838\u4f1a\u6d4b\u8bd5\u5173\u95ed\u540c\u6b65\u5f00\u5173\u540e\u662f\u5426\u8fd8\u6709\u540e\u53f0\u884c\u4e3a<\/li>\n<li>\u9690\u79c1\u653f\u7b56\u4e0e\u5b9e\u9645\u6743\u9650\u4e25\u683c\u4e00\u81f4&#xff0c;\u58f0\u660e\u4e86\u4ec0\u4e48\u6743\u9650\u5c31\u53ea\u7528\u4ec0\u4e48\u6743\u9650&#xff0c;\u591a\u4f59\u6743\u9650\u4f1a\u88ab\u8d28\u7591<\/li>\n<h4>10.4 \u4e0b\u4e00\u6b65\u89c4\u5212<\/h4>\n<ul>\n<li>v1.2.0&#xff1a;\u652f\u6301 Mermaid \u56fe\u8868\u6e32\u67d3&#xff08;\u7528\u6237\u547c\u58f0\u6700\u9ad8\u7684\u529f\u80fd&#xff09;<\/li>\n<li>v1.3.0&#xff1a;\u652f\u6301 Markdown \u8868\u683c\u7f16\u8f91\u589e\u5f3a&#xff08;\u53ef\u89c6\u5316\u7f16\u8f91&#xff09;<\/li>\n<li>v2.0.0&#xff1a;\u591a\u7aef\u534f\u540c\u7f16\u8f91&#xff08;\u540c\u4e00\u7bc7\u7b14\u8bb0\u591a\u8bbe\u5907\u540c\u65f6\u7f16\u8f91&#xff0c;\u5149\u6807\u7ea7\u540c\u6b65&#xff09;<\/li>\n<\/ul>\n<hr \/>\n<p>\u5982\u679c\u672c\u6587\u5bf9\u4f60\u6709\u5e2e\u52a9&#xff0c;\u6b22\u8fce\u70b9\u8d5e\u3001\u6536\u85cf\u3001\u8f6c\u53d1&#xff01;<br \/>\n\u4f60\u5728\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u4e2d\u9047\u5230\u8fc7\u54ea\u4e9b\u5ba1\u6838\u95ee\u9898&#xff1f;\u6b22\u8fce\u5728\u8bc4\u8bba\u533a\u4ea4\u6d41~<br \/>\n\u884c\u6587\u4ed3\u4fc3&#xff0c;\u5b9a\u6709\u4e0d\u8db3\u4e4b\u5904&#xff0c;\u6b22\u8fce\u5404\u4f4d\u670b\u53cb\u5728\u8bc4\u8bba\u533a\u6279\u8bc4\u6307\u6b63&#xff0c;\u4e0d\u80dc\u611f\u6fc0&#xff01;<\/p>\n<hr \/>\n<h3>\u8fb9\u754c\u4e0e\u5df2\u77e5\u9650\u5236<\/h3>\n<table>\n<tr>\u9650\u5236\u9879\u5177\u4f53\u8868\u73b0\u89c4\u907f\u65b9\u5f0f<\/tr>\n<tbody>\n<tr>\n<td>\u5f62\u6001\u80fd\u529b\u5dee\u5f02<\/td>\n<td>PC \u7aef\u90e8\u5206 Kit \u4e0e\u624b\u673a\u7aef\u4e0d\u4e00\u81f4<\/td>\n<td>\u4e0a\u67b6\u524d\u6838\u5bf9\u76ee\u6807\u5f62\u6001\u80fd\u529b\u6e05\u5355<\/td>\n<\/tr>\n<tr>\n<td>\u5206\u5e03\u5f0f\u524d\u63d0<\/td>\n<td>\u540c\u6b65\u4f9d\u8d56\u540c\u8d26\u53f7\u3001\u540c\u7f51\u7edc\u4e0e\u8bbe\u5907\u5728\u7ebf<\/td>\n<td>\u540c\u6b65\u524d\u6821\u9a8c\u524d\u7f6e\u6761\u4ef6<\/td>\n<\/tr>\n<tr>\n<td>\u6570\u636e\u51b2\u7a81<\/td>\n<td>\u591a\u7aef\u540c\u65f6\u7f16\u8f91\u4f1a\u4ea7\u751f\u51b2\u7a81<\/td>\n<td>\u5b9a\u4e49\u51b2\u7a81\u7b56\u7565\u5e76\u4fdd\u7559\u7248\u672c\u8bb0\u5f55<\/td>\n<\/tr>\n<tr>\n<td>\u7a97\u53e3\u751f\u547d\u5468\u671f<\/td>\n<td>PC \u591a\u7a97\u4e0b\u751f\u547d\u5468\u671f\u4e0e\u624b\u673a\u4e0d\u540c<\/td>\n<td>\u6309\u7a97\u53e3\u7ba1\u7406\u72b6\u6001\u4e0e\u8d44\u6e90\u91ca\u653e<\/td>\n<\/tr>\n<tr>\n<td>\u8f93\u5165\u5dee\u5f02<\/td>\n<td>\u952e\u9f20\u4e0e\u89e6\u63a7\u4ea4\u4e92\u8303\u5f0f\u4e0d\u540c<\/td>\n<td>\u5206\u522b\u9002\u914d\u5feb\u6377\u952e\u3001\u53f3\u952e\u4e0e\u624b\u52bf<\/td>\n<\/tr>\n<tr>\n<td>\u5ba1\u6838\u8981\u6c42<\/td>\n<td>PC \u4e13\u533a\u5ba1\u6838\u8981\u6c42\u4e0e\u79fb\u52a8\u7aef\u4e0d\u540c<\/td>\n<td>\u5355\u72ec\u51c6\u5907 PC \u7aef\u622a\u56fe\u4e0e\u8bf4\u660e<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h3>\u5c0f\u7ed3<\/h3>\n<p>PC \u7aef\u5e94\u7528\u7684\u5dee\u5f02\u4e0d\u5728 ArkUI \u5199\u6cd5&#xff0c;\u800c\u5728\u5f62\u6001\u5047\u8bbe&#xff1a;\u7a97\u53e3\u53ef\u81ea\u7531\u7f29\u653e\u3001\u8f93\u5165\u662f\u952e\u9f20\u3001\u591a\u7a97\u5e76\u5b58\u3001\u80fd\u529b\u6709\u7f3a\u53e3\u3002\u6cbf\u7528\u624b\u673a\u7aef\u5199\u6cd5\u7684\u90e8\u5206&#xff0c;\u57fa\u672c\u90fd\u8981\u91cd\u505a\u4e00\u904d\u4ea4\u4e92\u4e0e\u751f\u547d\u5468\u671f\u5904\u7406\u3002<\/p>\n<p>\u5206\u5e03\u5f0f\u80fd\u529b\u5219\u662f\u53e6\u4e00\u4e2a\u7ef4\u5ea6\u7684\u590d\u6742\u5ea6\u2014\u2014\u540c\u6b65\u524d\u6821\u9a8c\u524d\u7f6e\u6761\u4ef6&#xff0c;\u51b2\u7a81\u65f6\u4fdd\u7559\u7248\u672c&#xff0c;\u8fd9\u4e24\u4ef6\u4e8b\u51b3\u5b9a\u4e86\u591a\u7aef\u4f53\u9a8c\u662f&#034;\u65e0\u7f1d&#034;\u8fd8\u662f&#034;\u6570\u636e\u4e22\u5931&#034;\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u6458\u8981: \u672c\u6587\u8bb0\u5f55\u6211\u5f00\u53d1\u4e00\u6b3e\u9e3f\u8499 PC \u7aef\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u5e94\u7528\u5e76\u5b8c\u6210\u5e94\u7528\u5e02\u573a\u4e0a\u67b6\u7684\u5168\u8fc7\u7a0b\u3002\u4ece\u9700\u6c42\u8bbe\u8ba1\u3001\u7f16\u8f91\u5668\u5185\u6838\u5b9e\u73b0\u3001\u5206\u5e03\u5f0f\u6570\u636e\u540c\u6b65\u3001PC \u7aef\u7a97\u53e3\u9002\u914d&#xff0c;\u5230\u4e0a\u67b6\u8d44\u8d28\u51c6\u5907\u3001\u5ba1\u6838\u907f\u5751\u3001\u4e0a\u67b6\u540e\u4f18\u5316\u8fed\u4ee3&#xff0c;\u8986\u76d6\u5e94\u7528\u843d\u5730\u5b8c\u6574\u94fe\u8def\u3002\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u9047\u5230\u5206\u5e03\u5f0f\u6570\u636e\u51b2\u7a81\u3001\u7a97\u53e3\u751f\u547d\u5468\u671f\u3001\u8f6f\u952e\u76d8\u906e\u6321\u3001\u5ba1\u6838\u88ab\u62d2 4 \u7c7b\u5171 6 \u4e2a\u771f\u5b9e\u8e29\u5751\u95ee\u9898&#xff0c;\u9010\u4e00\u7ed9\u51fa\u5b9a\u4f4d\u4e0e\u89e3\u6cd5\u3002\u5e94\u7528\u4e0a\u67b6\u540e 30 \u5929\u5185\u4e0b\u8f7d 4200 \u6b21&#xff0c;\u8bc4\u5206 4.6 \u661f&#xff0c;\u5206\u5e03\u5f0f<\/p>\n","protected":false},"author":2,"featured_media":120062,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[12392,13717,10217,13716,280,3867],"topic":[],"class_list":["post-120065","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-server","tag-12392","tag-13717","tag-10217","tag--pc","tag-harmonyos","tag-markdown"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.3 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>\u3010\u9e3f\u8499\u5fc3\u8ff9\u3011\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u5b9e\u6218\uff1a\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u4ece\u5f00\u53d1\u5230\u8fc7\u5ba1\u5168\u6d41\u7a0b - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.wsisp.com\/helps\/120065.html\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u3010\u9e3f\u8499\u5fc3\u8ff9\u3011\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u5b9e\u6218\uff1a\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u4ece\u5f00\u53d1\u5230\u8fc7\u5ba1\u5168\u6d41\u7a0b - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\" \/>\n<meta property=\"og:description\" content=\"\u6458\u8981: \u672c\u6587\u8bb0\u5f55\u6211\u5f00\u53d1\u4e00\u6b3e\u9e3f\u8499 PC \u7aef\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u5e94\u7528\u5e76\u5b8c\u6210\u5e94\u7528\u5e02\u573a\u4e0a\u67b6\u7684\u5168\u8fc7\u7a0b\u3002\u4ece\u9700\u6c42\u8bbe\u8ba1\u3001\u7f16\u8f91\u5668\u5185\u6838\u5b9e\u73b0\u3001\u5206\u5e03\u5f0f\u6570\u636e\u540c\u6b65\u3001PC \u7aef\u7a97\u53e3\u9002\u914d&#xff0c;\u5230\u4e0a\u67b6\u8d44\u8d28\u51c6\u5907\u3001\u5ba1\u6838\u907f\u5751\u3001\u4e0a\u67b6\u540e\u4f18\u5316\u8fed\u4ee3&#xff0c;\u8986\u76d6\u5e94\u7528\u843d\u5730\u5b8c\u6574\u94fe\u8def\u3002\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u9047\u5230\u5206\u5e03\u5f0f\u6570\u636e\u51b2\u7a81\u3001\u7a97\u53e3\u751f\u547d\u5468\u671f\u3001\u8f6f\u952e\u76d8\u906e\u6321\u3001\u5ba1\u6838\u88ab\u62d2 4 \u7c7b\u5171 6 \u4e2a\u771f\u5b9e\u8e29\u5751\u95ee\u9898&#xff0c;\u9010\u4e00\u7ed9\u51fa\u5b9a\u4f4d\u4e0e\u89e3\u6cd5\u3002\u5e94\u7528\u4e0a\u67b6\u540e 30 \u5929\u5185\u4e0b\u8f7d 4200 \u6b21&#xff0c;\u8bc4\u5206 4.6 \u661f&#xff0c;\u5206\u5e03\u5f0f\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.wsisp.com\/helps\/120065.html\" \/>\n<meta property=\"og:site_name\" content=\"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\" \/>\n<meta property=\"article:published_time\" content=\"2026-10-30T16:16:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2026\/10\/20261030161644-6ae4c2ec23ea6.png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"14 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/120065.html\",\"url\":\"https:\/\/www.wsisp.com\/helps\/120065.html\",\"name\":\"\u3010\u9e3f\u8499\u5fc3\u8ff9\u3011\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u5b9e\u6218\uff1a\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u4ece\u5f00\u53d1\u5230\u8fc7\u5ba1\u5168\u6d41\u7a0b - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\",\"isPartOf\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/#website\"},\"datePublished\":\"2026-10-30T16:16:46+00:00\",\"dateModified\":\"2026-10-30T16:16:46+00:00\",\"author\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/120065.html#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.wsisp.com\/helps\/120065.html\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/120065.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"https:\/\/www.wsisp.com\/helps\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u3010\u9e3f\u8499\u5fc3\u8ff9\u3011\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u5b9e\u6218\uff1a\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u4ece\u5f00\u53d1\u5230\u8fc7\u5ba1\u5168\u6d41\u7a0b\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#website\",\"url\":\"https:\/\/www.wsisp.com\/helps\/\",\"name\":\"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\",\"description\":\"\u9999\u6e2f\u670d\u52a1\u5668_\u9999\u6e2f\u4e91\u670d\u52a1\u5668\u8d44\u8baf_\u670d\u52a1\u5668\u5e2e\u52a9\u6587\u6863_\u670d\u52a1\u5668\u6559\u7a0b\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.wsisp.com\/helps\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery\",\"contentUrl\":\"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery\",\"caption\":\"admin\"},\"sameAs\":[\"http:\/\/wp.wsisp.com\"],\"url\":\"https:\/\/www.wsisp.com\/helps\/author\/admin\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u3010\u9e3f\u8499\u5fc3\u8ff9\u3011\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u5b9e\u6218\uff1a\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u4ece\u5f00\u53d1\u5230\u8fc7\u5ba1\u5168\u6d41\u7a0b - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.wsisp.com\/helps\/120065.html","og_locale":"zh_CN","og_type":"article","og_title":"\u3010\u9e3f\u8499\u5fc3\u8ff9\u3011\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u5b9e\u6218\uff1a\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u4ece\u5f00\u53d1\u5230\u8fc7\u5ba1\u5168\u6d41\u7a0b - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","og_description":"\u6458\u8981: \u672c\u6587\u8bb0\u5f55\u6211\u5f00\u53d1\u4e00\u6b3e\u9e3f\u8499 PC \u7aef\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u5e94\u7528\u5e76\u5b8c\u6210\u5e94\u7528\u5e02\u573a\u4e0a\u67b6\u7684\u5168\u8fc7\u7a0b\u3002\u4ece\u9700\u6c42\u8bbe\u8ba1\u3001\u7f16\u8f91\u5668\u5185\u6838\u5b9e\u73b0\u3001\u5206\u5e03\u5f0f\u6570\u636e\u540c\u6b65\u3001PC \u7aef\u7a97\u53e3\u9002\u914d&#xff0c;\u5230\u4e0a\u67b6\u8d44\u8d28\u51c6\u5907\u3001\u5ba1\u6838\u907f\u5751\u3001\u4e0a\u67b6\u540e\u4f18\u5316\u8fed\u4ee3&#xff0c;\u8986\u76d6\u5e94\u7528\u843d\u5730\u5b8c\u6574\u94fe\u8def\u3002\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u9047\u5230\u5206\u5e03\u5f0f\u6570\u636e\u51b2\u7a81\u3001\u7a97\u53e3\u751f\u547d\u5468\u671f\u3001\u8f6f\u952e\u76d8\u906e\u6321\u3001\u5ba1\u6838\u88ab\u62d2 4 \u7c7b\u5171 6 \u4e2a\u771f\u5b9e\u8e29\u5751\u95ee\u9898&#xff0c;\u9010\u4e00\u7ed9\u51fa\u5b9a\u4f4d\u4e0e\u89e3\u6cd5\u3002\u5e94\u7528\u4e0a\u67b6\u540e 30 \u5929\u5185\u4e0b\u8f7d 4200 \u6b21&#xff0c;\u8bc4\u5206 4.6 \u661f&#xff0c;\u5206\u5e03\u5f0f","og_url":"https:\/\/www.wsisp.com\/helps\/120065.html","og_site_name":"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","article_published_time":"2026-10-30T16:16:46+00:00","og_image":[{"url":"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2026\/10\/20261030161644-6ae4c2ec23ea6.png"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"admin","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"14 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.wsisp.com\/helps\/120065.html","url":"https:\/\/www.wsisp.com\/helps\/120065.html","name":"\u3010\u9e3f\u8499\u5fc3\u8ff9\u3011\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u5b9e\u6218\uff1a\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u4ece\u5f00\u53d1\u5230\u8fc7\u5ba1\u5168\u6d41\u7a0b - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","isPartOf":{"@id":"https:\/\/www.wsisp.com\/helps\/#website"},"datePublished":"2026-10-30T16:16:46+00:00","dateModified":"2026-10-30T16:16:46+00:00","author":{"@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41"},"breadcrumb":{"@id":"https:\/\/www.wsisp.com\/helps\/120065.html#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.wsisp.com\/helps\/120065.html"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.wsisp.com\/helps\/120065.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"https:\/\/www.wsisp.com\/helps"},{"@type":"ListItem","position":2,"name":"\u3010\u9e3f\u8499\u5fc3\u8ff9\u3011\u9e3f\u8499 PC \u5e94\u7528\u4e0a\u67b6\u5b9e\u6218\uff1a\u5206\u5e03\u5f0f Markdown \u7b14\u8bb0\u4ece\u5f00\u53d1\u5230\u8fc7\u5ba1\u5168\u6d41\u7a0b"}]},{"@type":"WebSite","@id":"https:\/\/www.wsisp.com\/helps\/#website","url":"https:\/\/www.wsisp.com\/helps\/","name":"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","description":"\u9999\u6e2f\u670d\u52a1\u5668_\u9999\u6e2f\u4e91\u670d\u52a1\u5668\u8d44\u8baf_\u670d\u52a1\u5668\u5e2e\u52a9\u6587\u6863_\u670d\u52a1\u5668\u6559\u7a0b","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.wsisp.com\/helps\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41","name":"admin","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/image\/","url":"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery","contentUrl":"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery","caption":"admin"},"sameAs":["http:\/\/wp.wsisp.com"],"url":"https:\/\/www.wsisp.com\/helps\/author\/admin"}]}},"_links":{"self":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts\/120065","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/comments?post=120065"}],"version-history":[{"count":0,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts\/120065\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/media\/120062"}],"wp:attachment":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/media?parent=120065"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/categories?post=120065"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/tags?post=120065"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/topic?post=120065"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}