{"id":1893,"date":"2024-05-30T19:39:13","date_gmt":"2024-05-30T19:39:13","guid":{"rendered":"https:\/\/www.nicekj.com\/?p=1893"},"modified":"2024-05-30T19:39:26","modified_gmt":"2024-05-30T19:39:26","slug":"uniapp-appduanshixiandazijixiaoguo","status":"publish","type":"post","link":"https:\/\/www.nicekj.com\/uniapp-appduanshixiandazijixiaoguo.html","title":{"rendered":"uniapp APP\u7aef\u5b9e\u73b0\u6253\u5b57\u673a\u6548\u679c"},"content":{"rendered":"<p>\u6253\u5b57\u673a\u6548\u679c\u662f\u5728\u5404\u4e2aAI\u6a21\u578b\u4e2d\u90fd\u4f1a\u770b\u5230\u7684\uff0c\u6570\u636e\u4f20\u8f93\u4e3b\u8981\u662f\u7528sse\uff0c\u63a5\u53e3\u8fd4\u56de\u7684\u6570\u636e\u662f\u5e26markDown\u683c\u5f0f\u7684\u5b57\u6bb5\uff08\u4ee5\u4e0b\u7b80\u79f0md\u5b57\u6bb5\uff09\uff0c\u672c\u6587\u7ae0\u4e3b\u8981\u5c06\u5728\u5b89\u5353\u73af\u5883\u4e0b\u7684\u5b9e\u73b0\uff0c\u4ec5\u4f9b\u53c2\u8003\ud83d\ude00<\/p>\n<h1 data-id=\"heading-0\">\u6253\u5b57\u673a\u6548\u679c<\/h1>\n<h2 data-id=\"heading-1\">\u6253\u5b57\u673a\u7684\u5b9e\u73b0\u662f\u53c2\u8003\u53e6\u4e00\u4e2a\u5927\u4f6c\u6587\u7ae0\u4e2d\u7684\uff0c\u76f4\u63a5\u4f7f\u7528,\u5927\u4f6c\u7684\u662fts\u7248\u672c\uff0c\u6211\u7684\u662fjs\u7248\u672c<\/h2>\n<pre><\/div><div class=\"code-block-extension-headerRight\"><span class=\"code-block-extension-lang\">js<\/span><div class=\"code-block-extension-copyCodeBtn\">\u590d\u5236\u4ee3\u7801<\/div><\/div><\/div><code class=\"hljs language-js code-block-extension-codeShowNum\" lang=\"js\"><span class=\"code-block-extension-codeLine\" data-line-num=\"1\"><span class=\"hljs-comment\">\/\/ \u6253\u5b57\u673a\u961f\u5217<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"2\"><span class=\"hljs-keyword\">export<\/span> <span class=\"hljs-keyword\">class<\/span> <span class=\"hljs-title class_\">Typewriter<\/span> {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"3\">\tqueue = []<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"4\">\tconsuming = <span class=\"hljs-literal\">false<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"5\">\t<span class=\"hljs-title function_\">constructor<\/span>(<span class=\"hljs-params\">onConsume<\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"6\">\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">onConsume<\/span> = onConsume<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"7\">\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"8\">\t<span class=\"hljs-comment\">\/\/ \u8f93\u51fa\u901f\u5ea6\u52a8\u6001\u63a7\u5236<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"9\">\t<span class=\"hljs-title function_\">dynamicSpeed<\/span>(<span class=\"hljs-params\"><\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"10\">\t\t<span class=\"hljs-keyword\">const<\/span> speed = <span class=\"hljs-number\">2000<\/span> \/ <span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">queue<\/span>.<span class=\"hljs-property\">length<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"11\">\t\t<span class=\"hljs-keyword\">if<\/span> (speed &gt; <span class=\"hljs-number\">200<\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"12\">\t\t\t<span class=\"hljs-keyword\">return<\/span> <span class=\"hljs-number\">200<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"13\">\t\t} <span class=\"hljs-keyword\">else<\/span> {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"14\">\t\t\t<span class=\"hljs-keyword\">return<\/span> speed<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"15\">\t\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"16\">\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"17\">\t<span class=\"hljs-comment\">\/\/ \u6dfb\u52a0\u5b57\u7b26\u4e32\u5230\u961f\u5217<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"18\">\t<span class=\"hljs-title function_\">add<\/span>(<span class=\"hljs-params\">str<\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"19\">\t\t<span class=\"hljs-keyword\">if<\/span> (!str) <span class=\"hljs-keyword\">return<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"20\">\t\tstr = str.<span class=\"hljs-title function_\">replaceAll<\/span>(<span class=\"hljs-string\">'\\n'<\/span>, <span class=\"hljs-string\">'n'<\/span>);<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"21\">\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">queue<\/span>.<span class=\"hljs-title function_\">push<\/span>(...str.<span class=\"hljs-title function_\">split<\/span>(<span class=\"hljs-string\">''<\/span>));<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"22\">\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"23\">\t<span class=\"hljs-comment\">\/\/ \u6d88\u8d39<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"24\">\t<span class=\"hljs-title function_\">consume<\/span>(<span class=\"hljs-params\"><\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"25\">\t\t<span class=\"hljs-keyword\">if<\/span> (<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">queue<\/span>.<span class=\"hljs-property\">length<\/span> &gt; <span class=\"hljs-number\">0<\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"26\">\t\t\t<span class=\"hljs-keyword\">const<\/span> str = <span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">queue<\/span>.<span class=\"hljs-title function_\">shift<\/span>()<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"27\">\t\t\tstr &amp;&amp; <span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-title function_\">onConsume<\/span>(str)<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"28\">\t\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"29\">\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"30\">\t<span class=\"hljs-comment\">\/\/ \u6d88\u8d39\u4e0b\u4e00\u4e2a<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"31\">\t<span class=\"hljs-title function_\">next<\/span>(<span class=\"hljs-params\"><\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"32\">\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-title function_\">consume<\/span>()<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"33\">\t\t<span class=\"hljs-comment\">\/\/ \u6839\u636e\u961f\u5217\u4e2d\u5b57\u7b26\u7684\u6570\u91cf\u6765\u8bbe\u7f6e\u6d88\u8017\u6bcf\u4e00\u5e27\u7684\u901f\u5ea6\uff0c\u7528\u5b9a\u65f6\u5668\u6d88\u8017<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"34\">\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">timmer<\/span> = <span class=\"hljs-built_in\">setTimeout<\/span>(<span class=\"hljs-function\">() =&gt;<\/span> {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"35\">\t\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-title function_\">consume<\/span>()<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"36\">\t\t\t<span class=\"hljs-keyword\">if<\/span> (<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">consuming<\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"37\">\t\t\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-title function_\">next<\/span>()<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"38\">\t\t\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"39\">\t\t}, <span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-title function_\">dynamicSpeed<\/span>())<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"40\">\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"41\">\t<span class=\"hljs-comment\">\/\/ \u5f00\u59cb\u6d88\u8d39\u961f\u5217<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"42\">\t<span class=\"hljs-title function_\">start<\/span>(<span class=\"hljs-params\"><\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"43\">\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">consuming<\/span> = <span class=\"hljs-literal\">true<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"44\">\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-title function_\">next<\/span>()<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"45\">\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"46\">\t<span class=\"hljs-comment\">\/\/ \u7ed3\u675f\u6d88\u8d39\u961f\u5217<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"47\">\t<span class=\"hljs-title function_\">done<\/span>(<span class=\"hljs-params\"><\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"48\">\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">consuming<\/span> = <span class=\"hljs-literal\">false<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"49\">\t\t<span class=\"hljs-built_in\">clearTimeout<\/span>(<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">timmer<\/span>)<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"50\">\t\t<span class=\"hljs-comment\">\/\/ \u628aqueue\u4e2d\u5269\u4e0b\u7684\u5b57\u7b26\u4e00\u6b21\u6027\u6d88\u8d39<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"51\">\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-title function_\">onConsume<\/span>(<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">queue<\/span>.<span class=\"hljs-title function_\">join<\/span>(<span class=\"hljs-string\">\"\"<\/span>))<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"52\">\t\t<span class=\"hljs-variable language_\">this<\/span>.<span class=\"hljs-property\">queue<\/span> = []<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"53\">\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"54\">}<\/span>\n<\/code><\/pre>\n<ul>\n<li>\u5f15\u5165\u4f7f\u7528<\/li>\n<\/ul>\n<pre><\/div><div class=\"code-block-extension-headerRight\"><span class=\"code-block-extension-lang\">js<\/span><div class=\"code-block-extension-copyCodeBtn\">\u590d\u5236\u4ee3\u7801<\/div><\/div><\/div><code class=\"hljs language-js code-block-extension-codeShowNum\" lang=\"js\"><span class=\"code-block-extension-codeLine\" data-line-num=\"1\"><span class=\"hljs-keyword\">import<\/span> { <span class=\"hljs-title class_\">Typewriter<\/span> } <span class=\"hljs-keyword\">from<\/span> <span class=\"hljs-string\">'@\/utils\/typeWriter.js'<\/span>;<\/span>\n<\/code><\/pre>\n<h1 data-id=\"heading-2\">\u7531\u4e8euniapp \u65e0\u6cd5\u4f7f\u7528sse\uff0c\u9700\u8981\u4f7f\u7528\u5230\u63d2\u4ef6fetch-event-source\u52a0\u4e0arenderjs<\/h1>\n<h2 data-id=\"heading-3\">\u4f7f\u7528renderjs<\/h2>\n<p>\u4f7f\u7528rederjs \u53ef\u53c2\u8003uniapp\u5b98\u7f51\n<a href=\"https:\/\/link.juejin.cn?target=https%3A%2F%2Funiapp.dcloud.net.cn%2Ftutorial%2Frenderjs.html%23renderjs\" target=\"_blank\" title=\"https:\/\/uniapp.dcloud.net.cn\/tutorial\/renderjs.html#renderjs\" ref=\"nofollow noopener noreferrer\" rel=\"noopener\">renderjs | uni-app\u5b98\u7f51 (dcloud.net.cn)<\/a><\/p>\n<p>\u4f46\u662f\u5176\u4e2d\u76f4\u63a5\u83b7\u53d6\u903b\u8f91\u5c42option\u7684\u503c\u7684\u5199\u6cd5\u53ea\u6709\u5728<strong>h5\u9875\u9762<\/strong>\u624d\u751f\u6548\uff0c\u5728<strong>APP\u7aef<\/strong>\u7528\u4e0d\u4e86\uff0c\u90a3\u5982\u4f55\u53d6\u903b\u8f91\u5c42\u7684\u6570\u636e\u5462\uff1f<\/p>\n<p>\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/www.nicekj.com\/wp-content\/uploads\/replace\/2e83d282b92654adf753ae17a0833443.png\" alt=\"image.png\" \/><\/figure>\n<\/p>\n<h3 data-id=\"heading-4\">\u83b7\u53d6\u903b\u8f91\u5c42\u7684\u6570\u636e<\/h3>\n<p>\u7531\u4e8e\u4f7f\u7528\u4e86renderjs\uff0c\u53ef\u4ee5\u4f7f\u7528document<br>\n\u5728\u903b\u8f91\u5c42\u5b9a\u4e49\u6570\u636e\u7ed1\u5b9a\u5728\u4e00\u4e2a\u5143\u7d20\u4e0a\uff08\u8fd9\u4e2a\u5143\u7d20\u4e13\u95e8\u62ff\u6765\u4f20\u8f93\u6570\u636e\uff09\uff0c\u7528document\u83b7\u53d6\u5143\u7d20\uff0c\u518d\u4f7f\u7528getAttribute\u53bb\u83b7\u53d6\u5b9a\u4e49\u7684\u6570\u636e<\/p>\n<pre><\/div><div class=\"code-block-extension-headerRight\"><span class=\"code-block-extension-lang\">js<\/span><div class=\"code-block-extension-copyCodeBtn\">\u590d\u5236\u4ee3\u7801<\/div><\/div><\/div><code class=\"hljs language-js code-block-extension-codeShowNum\" lang=\"js\"><span class=\"code-block-extension-codeLine\" data-line-num=\"1\"><span class=\"hljs-comment\">\/\/\u81ea\u5b9a\u4e49\u6570\u636e\u7ed1\u5b9a\u5143\u7d20<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"2\">&lt;view id=<span class=\"hljs-string\">\"transmit\"<\/span> :data-url=<span class=\"hljs-string\">\"typeWriterUrl\"<\/span> :data-uid=<span class=\"hljs-string\">\"curUid\"<\/span> :data-trainId=<span class=\"hljs-string\">\"trainId\"<\/span> &gt;&lt;\/view&gt;<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"3\"><span class=\"hljs-comment\">\/\/\u83b7\u53d6\u6570\u636e<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"4\"><span class=\"hljs-keyword\">let<\/span> typeWriterView = <span class=\"hljs-variable language_\">document<\/span>.<span class=\"hljs-title function_\">getElementById<\/span>(<span class=\"hljs-string\">'typeWriterView'<\/span>)<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"5\"><span class=\"hljs-keyword\">let<\/span> url = transmit.<span class=\"hljs-title function_\">getAttribute<\/span>(<span class=\"hljs-string\">\"data-url\"<\/span>);<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"6\"><span class=\"hljs-keyword\">let<\/span> uid = transmit.<span class=\"hljs-title function_\">getAttribute<\/span>(<span class=\"hljs-string\">\"data-uid\"<\/span>);<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"7\"><span class=\"hljs-keyword\">let<\/span> fitnessAssessmentId = transmit.<span class=\"hljs-title function_\">getAttribute<\/span>(<span class=\"hljs-string\">\"data-trainId\"<\/span>);<\/span>\n<\/code><\/pre>\n<p>\u90a3\u903b\u8f91\u5c42\u7684\u6570\u636e\u5982\u4f55\u9a71\u52a8renderjs\u7684\u6570\u636e\u5462\n\u53ef\u4ee5\u7ed1\u5b9a\u6570\u636e\u5728\u5143\u7d20\u4e0a\uff0c<code>:isInvoke=\"isInvoke\" <\/code><br>\n\u4f7f\u7528<code>:change:isInvoke=\"typeWriterRender.receiveMsg\"<\/code>renderjs\u4e2d\u4f7f\u7528\u76d1\u542c\u4e8b\u4ef6\u76d1\u542c\u6570\u636e\u7684\u53d8\u5316<br>\n\u5176\u4e2d<strong>typeWriterRender<\/strong>\u5bf9\u5e94renderjs\u4e2d\u58f0\u660e\u7684<strong>module<\/strong>\uff0c<strong>receiveMsg<\/strong>\u662f\u5bf9\u5e94\u76d1\u542c\u4e8b\u4ef6<\/p>\n<pre><\/div><div class=\"code-block-extension-headerRight\"><span class=\"code-block-extension-lang\">js<\/span><div class=\"code-block-extension-copyCodeBtn\">\u590d\u5236\u4ee3\u7801<\/div><\/div><\/div><code class=\"hljs language-js code-block-extension-codeShowNum\" lang=\"js\"><span class=\"code-block-extension-codeLine\" data-line-num=\"1\"><span class=\"hljs-comment\">\/\/\u5143\u7d20<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"2\">&lt;view id=<span class=\"hljs-string\">\"transmit\"<\/span> :data-url=<span class=\"hljs-string\">\"typeWriterUrl\"<\/span> :data-uid=<span class=\"hljs-string\">\"curUid\"<\/span> :data-trainId=<span class=\"hljs-string\">\"trainId\"<\/span> :isInvoke=<span class=\"hljs-string\">\"isInvoke\"<\/span> :<span class=\"hljs-attr\">change<\/span>:isInvoke=<span class=\"hljs-string\">\"typeWriterRender.receiveMsg\"<\/span>&gt;&lt;\/view&gt;<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"3\"><span class=\"hljs-comment\">\/\/renderjs\u4e2d receiveMsg \u76d1\u542c\u4e8b\u4ef6<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"4\"><span class=\"hljs-title function_\">receiveMsg<\/span>(<span class=\"hljs-params\">newValue, oldValue, ownerVm, vm<\/span>) {}<\/span>\n<\/code><\/pre>\n<h2 data-id=\"heading-5\">\u4f7f\u7528fetch-event-source<\/h2>\n<ul>\n<li>\u5b89\u88c5fetch-event-source<\/li>\n<\/ul>\n<pre><\/div><div class=\"code-block-extension-headerRight\"><span class=\"code-block-extension-lang\">js<\/span><div class=\"code-block-extension-copyCodeBtn\">\u590d\u5236\u4ee3\u7801<\/div><\/div><\/div><code class=\"hljs language-js code-block-extension-codeShowNum\" lang=\"js\"><span class=\"code-block-extension-codeLine\" data-line-num=\"1\">npm install @microsoft\/fetch-event-source<\/span>\n<\/code><\/pre>\n<ul>\n<li>\u5f15\u5165fetch-event-source<\/li>\n<\/ul>\n<pre><\/div><div class=\"code-block-extension-headerRight\"><span class=\"code-block-extension-lang\">js<\/span><div class=\"code-block-extension-copyCodeBtn\">\u590d\u5236\u4ee3\u7801<\/div><\/div><\/div><code class=\"hljs language-js code-block-extension-codeShowNum\" lang=\"js\"><span class=\"code-block-extension-codeLine\" data-line-num=\"1\"><span class=\"hljs-keyword\">import<\/span> { fetchEventSource } <span class=\"hljs-keyword\">from<\/span> <span class=\"hljs-string\">'@microsoft\/fetch-event-source'<\/span>;<\/span>\n<\/code><\/pre>\n<ul>\n<li>\u4f7f\u7528fetch-event-source \u8fdb\u884cpost\u8bf7\u6c42<\/li>\n<\/ul>\n<p>\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/www.nicekj.com\/wp-content\/uploads\/replace\/5116007491d72d433fbb190357f1cf2a.png\" alt=\"image.png\" \/><\/figure>\n<\/p>\n<h1 data-id=\"heading-6\">\u4f7f\u7528markdown-it<\/h1>\n<ul>\n<li>\u5b89\u88c5markdown-it<\/li>\n<\/ul>\n<pre><\/div><div class=\"code-block-extension-headerRight\"><span class=\"code-block-extension-lang\">js<\/span><div class=\"code-block-extension-copyCodeBtn\">\u590d\u5236\u4ee3\u7801<\/div><\/div><\/div><code class=\"hljs language-js code-block-extension-codeShowNum\" lang=\"js\"><span class=\"code-block-extension-codeLine\" data-line-num=\"1\">npm install markdown-it<\/span>\n<\/code><\/pre>\n<ul>\n<li>\u4f7f\u7528<\/li>\n<\/ul>\n<pre><\/div><div class=\"code-block-extension-headerRight\"><span class=\"code-block-extension-lang\">js<\/span><div class=\"code-block-extension-copyCodeBtn\">\u590d\u5236\u4ee3\u7801<\/div><\/div><\/div><code class=\"hljs language-js code-block-extension-codeShowNum\" lang=\"js\"><span class=\"code-block-extension-codeLine\" data-line-num=\"1\"><span class=\"hljs-keyword\">import<\/span> <span class=\"hljs-title class_\">MarkdownIt<\/span> <span class=\"hljs-keyword\">from<\/span> <span class=\"hljs-string\">'markdown-it'<\/span>;<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"2\"><span class=\"hljs-comment\">\/\/\u521d\u59cb\u5316<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"3\"><span class=\"hljs-keyword\">let<\/span> md = <span class=\"hljs-title class_\">MarkdownIt<\/span>({<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"4\">  <span class=\"hljs-attr\">html<\/span>: <span class=\"hljs-literal\">true<\/span>,<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"5\">  <span class=\"hljs-attr\">linkify<\/span>: <span class=\"hljs-literal\">true<\/span>,<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"6\">  <span class=\"hljs-attr\">typographer<\/span>: <span class=\"hljs-literal\">true<\/span>,<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"7\">});<\/span>\n<\/code><\/pre>\n<h2 data-id=\"heading-7\">\u603b\u4f53\u5b9e\u73b0<\/h2>\n<pre><\/div><div class=\"code-block-extension-headerRight\"><span class=\"code-block-extension-lang\">js<\/span><div class=\"code-block-extension-copyCodeBtn\">\u590d\u5236\u4ee3\u7801<\/div><\/div><\/div><code class=\"hljs language-js code-block-extension-codeShowNum\" lang=\"js\"><span class=\"code-block-extension-codeLine\" data-line-num=\"1\"><span class=\"hljs-comment\">\/\/new \u4e00\u4e2a\u6253\u5b57\u673a\u7c7b\u7684\u5bf9\u8c61 \u751f\u6210html<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"2\">typeWriterSelf = <span class=\"hljs-keyword\">new<\/span> <span class=\"hljs-title class_\">Typewriter<\/span>(<span class=\"hljs-function\">(<span class=\"hljs-params\">str<\/span>) =&gt;<\/span> {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"3\">\t\thtmlmd += str;<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"4\">                <span class=\"hljs-comment\">\/\/\u83b7\u53d6\u5143\u7d20<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"5\">\t\t<span class=\"hljs-keyword\">let<\/span> typeWriterView = <span class=\"hljs-variable language_\">document<\/span>.<span class=\"hljs-title function_\">getElementById<\/span>(<span class=\"hljs-string\">'typeWriterView'<\/span>)<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"6\">                <span class=\"hljs-comment\">\/\/md\u5b57\u6bb5\u8f6c\u6210html<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"7\">\t\t<span class=\"hljs-keyword\">let<\/span> html = md.<span class=\"hljs-title function_\">render<\/span>(htmlmd);<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"8\">                <span class=\"hljs-comment\">\/\/\u76f4\u63a5\u8bbe\u7f6ehtml<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"9\">\t\ttypeWriterView.<span class=\"hljs-property\">innerHTML<\/span> = html;<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"10\">});<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"11\"><span class=\"hljs-comment\">\/\/\u521d\u59cb\u5316<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"12\">typeWriterSelf.<span class=\"hljs-title function_\">start<\/span>();<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"13\"><span class=\"hljs-comment\">\/\/\u76d1\u542c\u63a5\u53e3\u8fd4\u56de\u7684\u6570\u636e \u6dfb\u52a0\u5230\u6253\u5b57\u7c7b\u4e2d<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"14\"><span class=\"hljs-keyword\">const<\/span> ctrl = <span class=\"hljs-keyword\">new<\/span> <span class=\"hljs-title class_\">AbortController<\/span>();<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"15\"><span class=\"hljs-title function_\">fetchEventSource<\/span>(url + <span class=\"hljs-string\">'\/xxx\/xxx'<\/span>, {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"16\">\t\t\t\t<span class=\"hljs-attr\">method<\/span>: <span class=\"hljs-string\">'POST'<\/span>,<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"17\">\t\t\t\t<span class=\"hljs-attr\">headers<\/span>: {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"18\">\t\t\t\t\t<span class=\"hljs-string\">'Content-Type'<\/span>: <span class=\"hljs-string\">'application\/json'<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"19\">\t\t\t\t},<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"20\">\t\t\t\t<span class=\"hljs-attr\">body<\/span>: <span class=\"hljs-title class_\">JSON<\/span>.<span class=\"hljs-title function_\">stringify<\/span>({<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"21\">\t\t\t\t\tuid,<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"22\">\t\t\t\t\tfitnessAssessmentId<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"23\">\t\t\t\t}),<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"24\">\t\t\t\t<span class=\"hljs-attr\">signal<\/span>: ctrl.<span class=\"hljs-property\">signal<\/span>,<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"25\">\t\t\t\t<span class=\"hljs-title function_\">onmessage<\/span>(<span class=\"hljs-params\">msg<\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"26\">\t\t\t\t\t<span class=\"hljs-keyword\">if<\/span> (msg.<span class=\"hljs-property\">event<\/span> === <span class=\"hljs-string\">''<\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"27\">\t\t\t\t\t\t<span class=\"hljs-keyword\">var<\/span> result = msg.<span class=\"hljs-property\">data<\/span>;<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"28\">                                                <span class=\"hljs-comment\">\/\/\u83b7\u53d6\u6570\u636e\u6dfb\u52a0<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"29\">\t\t\t\t\t\ttypeWriterSelf.<span class=\"hljs-title function_\">add<\/span>(result);<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"30\">\t\t\t\t\t} <span class=\"hljs-keyword\">else<\/span> <span class=\"hljs-keyword\">if<\/span> (msg.<span class=\"hljs-property\">event<\/span> === <span class=\"hljs-string\">'close'<\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"31\">\t\t\t\t\t\tctrl.<span class=\"hljs-title function_\">abort<\/span>();<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"32\">\t\t\t\t\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"33\">\t\t\t\t},<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"34\">\t\t\t\t<span class=\"hljs-title function_\">onerror<\/span>(<span class=\"hljs-params\">err<\/span>) {<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"35\">\t\t\t\t\t<span class=\"hljs-variable language_\">console<\/span>.<span class=\"hljs-title function_\">log<\/span>(<span class=\"hljs-string\">'err=&gt;&gt;&gt;'<\/span>,err);<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"36\">\t\t\t\t\t<span class=\"hljs-keyword\">throw<\/span> err; <span class=\"hljs-comment\">\/\/\u5fc5\u987bthrow\u624d\u80fd\u505c\u6b62<\/span><\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"37\">\t\t\t\t}<\/span>\n<span class=\"code-block-extension-codeLine\" data-line-num=\"38\">\t\t\t});<\/span>\n<\/code><\/pre>\n<h4 data-id=\"heading-8\">\u53c2\u8003\u6587\u7ae0<\/h4>\n<ul>\n<li><a href=\"https:\/\/link.juejin.cn?target=https%3A%2F%2Fask.dcloud.net.cn%2Farticle%2F40816\" target=\"_blank\" title=\"https:\/\/ask.dcloud.net.cn\/article\/40816\" ref=\"nofollow noopener noreferrer\" rel=\"noopener\">uni-app\u901a\u8fc7SSE\u652f\u6301\u6d41\u5f0f\u6548\u679c &#8211; DCloud\u95ee\u7b54<\/a><\/li>\n<li><a href=\"https:\/\/juejin.cn\/post\/7237426124669157433\" target=\"_blank\" title=\"https:\/\/juejin.cn\/post\/7237426124669157433\" rel=\"noopener\">\u4ece\u96f6\u5f00\u59cb\uff1a\u5b9e\u73b0ChatGpt \u6253\u5b57\u673a\u804a\u5929\u6548\u679c &#8211; \u6398\u91d1 (juejin.cn)<\/a><\/li>\n<\/ul>","protected":false},"excerpt":{"rendered":"<p>uniapp APP\u7aef\u5b9e\u73b0\u6253\u5b57\u673a\u6548\u679c \u4f7f\u7528\u63d2\u4ef6fetch-event-source\u52a0\u4e0arenderjs<\/p>\n","protected":false},"author":1,"featured_media":11815,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"rank_math_title":"","rank_math_description":"","rank_math_focus_keyword":"","views":"1","footnotes":""},"categories":[3],"tags":[126,127,128,129,136],"collection":[],"class_list":["post-1893","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-fenlei2","tag-gpt","tag-ai","tag-128","tag-129","tag-136"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/posts\/1893","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/comments?post=1893"}],"version-history":[{"count":0,"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/posts\/1893\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/media\/11815"}],"wp:attachment":[{"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/media?parent=1893"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/categories?post=1893"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/tags?post=1893"},{"taxonomy":"collection","embeddable":true,"href":"https:\/\/www.nicekj.com\/nicekj2024\/wp\/v2\/collection?post=1893"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}