{"id":215,"date":"2021-06-04T07:39:07","date_gmt":"2021-06-04T07:39:07","guid":{"rendered":"https:\/\/www.jieshop.info\/?p=215"},"modified":"2021-11-22T00:14:33","modified_gmt":"2021-11-21T16:14:33","slug":"proin-ex-ipsum-facilisis-tincidunt-vulputate","status":"publish","type":"post","link":"https:\/\/www.jieshop.info\/?p=215","title":{"rendered":"Vue \u7b14\u8bb0\u5b66\u4e60"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">\u4e00\u3001\u524d\u7aef\u6838\u5fc3\u5206\u6790<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><br>1.1\u3001\u6982\u8ff0<\/h3>\n\n\n\n<div class=\"wp-block-group\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<ul class=\"wp-block-list\"><li>Soc\u539f\u5219\uff1a\u5173\u6ce8\u70b9\u5206\u79bb\u539f\u5219<\/li><li>Vue \u7684\u6838\u5fc3\u5e93\u53ea\u5173\u6ce8\u89c6\u56fe\u5c42\uff0c\u65b9\u4fbf\u4e0e\u7b2c\u4e09\u65b9\u5e93\u6216\u65e2\u6709\u9879\u76ee\u6574\u5408\u3002<\/li><li>HTML + CSS + JS : \u89c6\u56fe \uff1a \u7ed9\u7528\u6237\u770b\uff0c\u5237\u65b0\u540e\u53f0\u7ed9\u7684\u6570\u636e<\/li><li>\u7f51\u7edc\u901a\u4fe1 \uff1a axios<\/li><li>\u9875\u9762\u8df3\u8f6c \uff1a vue-router<\/li><li>\u72b6\u6001\u7ba1\u7406\uff1avuex<\/li><li>Vue-UI : ICE , Element UI<br><\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">1.2\u3001\u524d\u7aef\u4e09\u8981\u7d20<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>HTML\uff08\u7ed3\u6784\uff09\uff1a\u8d85\u6587\u672c\u6807\u8bb0\u8bed\u8a00\uff08Hyper Text Markup Language\uff09\uff0c\u51b3\u5b9a\u7f51\u9875\u7684\u7ed3\u6784\u548c\u5185\u5bb9<\/li><li>CSS\uff08\u8868\u73b0\uff09\uff1a\u5c42\u53e0\u6837\u5f0f\u8868\uff08Cascading Style Sheets\uff09\uff0c\u8bbe\u5b9a\u7f51\u9875\u7684\u8868\u73b0\u6837\u5f0f\u3002<\/li><li>JavaScript\uff08\u884c\u4e3a\uff09\uff1a\u662f\u4e00\u79cd\u5f31\u7c7b\u578b\u811a\u672c\u8bed\u8a00\uff0c\u5176\u6e90\u7801\u4e0d\u9700\u7ecf\u8fc7\u7f16\u8bd1\uff0c\u800c\u662f\u7531\u6d4f\u89c8\u5668\u89e3\u91ca\u8fd0\u884c\uff0c\u7528\u4e8e\u63a7\u5236\u7f51\u9875\u7684\u884c\u4e3a<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">1.3\u3001\u7ed3\u6784\u5c42\uff08HTML\uff09<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u4e00\u4e2a\u5bf9\u8c61\u7684\u8eab\u4f53\uff0c\u7ed3\u6784\u662f\u6781\u5176\u91cd\u8981\u7684<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">1.4\u3001\u8868\u73b0\u5c42\uff08CSS\uff09<\/h2>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>CSS\u5c42\u53e0\u6837\u5f0f\u8868\u662f\u4e00\u95e8\u6807\u8bb0\u8bed\u8a00\uff0c\u5e76\u4e0d\u662f\u7f16\u7a0b\u8bed\u8a00\uff0c\u56e0\u6b64\u4e0d\u53ef\u4ee5\u81ea\u5b9a\u4e49\u53d8\u91cf\uff0c\u4e0d\u53ef\u4ee5\u5f15\u7528\u7b49\uff0c\u6362\u53e5\u8bdd\u8bf4\u5c31\u662f\u4e0d\u5177\u5907\u4efb\u4f55\u8bed\u6cd5\u652f\u6301\uff0c\u5b83\u4e3b\u8981\u7f3a\u9677\u5982\u4e0b\uff1a<\/p><p>\u8bed\u6cd5\u4e0d\u591f\u5f3a\u5927\uff0c\u6bd4\u5982\u65e0\u6cd5\u5d4c\u5957\u4e66\u5199\uff0c\u5bfc\u81f4\u6a21\u5757\u5316\u5f00\u53d1\u4e2d\u9700\u8981\u4e66\u5199\u5f88\u591a\u91cd\u590d\u7684\u9009\u62e9\u5668\uff1b<br>\u6ca1\u6709\u53d8\u91cf\u548c\u5408\u7406\u7684\u6837\u5f0f\u590d\u7528\u673a\u5236\uff0c\u4f7f\u5f97\u903b\u8f91\u4e0a\u76f8\u5173\u7684\u5c5e\u6027\u503c\u5fc5\u987b\u4ee5\u5b57\u9762\u91cf\u7684\u5f62\u5f0f\u91cd\u590d\u8f93\u51fa\uff0c\u5bfc\u81f4\u96be\u4ee5\u7ef4\u62a4\uff1b<br>\u8fd9\u5c31\u5bfc\u81f4\u4e86\u6211\u4eec\u5728\u5de5\u4f5c\u4e2d\u65e0\u7aef\u589e\u52a0\u4e86\u8bb8\u591a\u5de5\u4f5c\u91cf\u3002\u4e3a\u4e86\u89e3\u51b3\u8fd9\u4e2a\u95ee\u9898\uff0c\u524d\u7aef\u5f00\u53d1\u4eba\u5458\u4f1a\u4f7f\u7528\u4e00\u79cd\u79f0\u4e4b\u4e3a\u3010CSS\u9884\u5904\u7406\u5668\u3011\u7684\u5de5\u5177,\u63d0\u4f9bCSS\u7f3a\u5931\u7684\u6837\u5f0f\u5c42\u590d\u7528\u673a\u5236\u3001\u51cf\u5c11\u5197\u4f59\u4ee3\u7801\uff0c\u63d0\u9ad8\u6837\u5f0f\u4ee3\u7801\u7684\u53ef\u7ef4\u62a4\u6027\u3002\u5927\u5927\u7684\u63d0\u9ad8\u4e86\u524d\u7aef\u5728\u6837\u5f0f\u4e0a\u7684\u5f00\u53d1\u6548\u7387\u3002<\/p><\/blockquote>\n\n\n\n<h2 class=\"wp-block-heading\"><br>1.5\u3001\u884c\u4e3a\u5c42\uff08JavaScript\uff09<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>JavaScript\u4e00\u95e8\u5f31\u7c7b\u578b\u811a\u672c\u8bed\u8a00\uff0c\u5176\u6e90\u4ee3\u7801\u5728\u53d1\u5f80\u5ba2\u6237\u7aef\u8fd0\u884c\u4e4b\u524d\u4e0d\u9700\u8981\u7ecf\u8fc7\u7f16\u8bd1\uff0c\u800c\u662f\u5c06\u6587\u672c\u683c\u5f0f\u7684\u5b57\u7b26\u4ee3\u7801\u53d1\u9001\u7ed9\u6d4f\u89c8\u5668\uff0c\u7531\u6d4f\u89c8\u5668\u89e3\u91ca\u8fd0\u884c\u3002<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Native \u539f\u751fJS\u5f00\u53d1<\/h2>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>\u539f\u751fJS\u5f00\u53d1\uff0c\u4e5f\u5c31\u662f\u8ba9\u6211\u4eec\u6309\u7167\u3010ECMAScript\u3011\u6807\u51c6\u7684\u5f00\u53d1\u65b9\u5f0f\uff0c\u7b80\u79f0ES\uff0c\u7279\u70b9\u662f\u6240\u6709\u6d4f\u89c8\u5668\u90fd\u652f\u6301\u3002\u622a\u81f3\u5230\u5f53\u524d\uff0cES\u6807\u51c6\u4ee5\u53d1\u5e03\u5982\u4e0b\u7248\u672c\uff1a<\/p><p>ES3<br>ES4\uff08\u5185\u90e8\uff0c\u672a\u6b63\u5f0f\u53d1\u5e03\uff09<br>ES5\uff08\u5168\u6d4f\u89c8\u5668\u652f\u6301\uff09<br>ES6\uff08\u5e38\u7528\uff0c\u5f53\u524d\u4e3b\u6d41\u7248\u672c\uff1awebpack\u6253\u5305\u6210\u4e3aES5\u652f\u6301\uff09<br>ES7<br>ES8<br>ES9\uff08\u8349\u6848\u9636\u6bb5\uff09<br>\u533a\u522b\u5c31\u662f\u9010\u6b65\u589e\u52a0\u65b0\u7279\u6027\u3002<br>TypeScript \u5fae\u8f6f\u7684\u6807\u51c6<br>TypeScript\u662f\u4e00\u79cd\u7531\u5fae\u8f6f\u5f00\u53d1\u7684\u81ea\u7531\u548c\u5f00\u6e90\u7684\u7f16\u7a0b\u8bed\u8a00\u3002\u5b83\u662fJavaScript\u7684\u4e00\u4e2a\u8d85\u96c6\uff0c \u800c\u4e14\u672c\u8d28\u4e0a\u5411\u8fd9\u4e2a\u8bed\u8a00\u6dfb\u52a0\u4e86\u53ef\u9009\u7684\u9759\u6001\u7c7b\u578b\u548c\u57fa\u4e8e\u7c7b\u7684\u9762\u5411\u5bf9\u8c61\u7f16\u7a0b\u3002\u7531\u5b89\u5fb7\u65af\u00b7\u6d77\u5c14\u65af\u4f2f\u683c(C#\u3001Delphi\u3001TypeScript\u4e4b\u7236\uff1b .NET\u521b\u7acb\u8005) \u4e3b\u5bfc\u3002\u8be5\u8bed\u8a00\u7684\u7279\u70b9\u5c31\u662f\u9664\u4e86\u5177\u5907ES\u7684\u7279\u6027\u4e4b\u5916\u8fd8\u7eb3\u5165\u4e86\u8bb8\u591a\u4e0d\u5728\u6807\u51c6\u8303\u56f4\u5185\u7684\u65b0\u7279\u6027\uff0c\u6240\u4ee5\u4f1a\u5bfc\u81f4\u5f88\u591a\u6d4f\u89c8\u5668\u4e0d\u80fd\u76f4\u63a5\u652f\u6301TypeScript\u8bed\u6cd5\uff0c \u9700\u8981\u7f16\u8bd1\u540e(\u7f16\u8bd1\u6210JS) \u624d\u80fd\u88ab\u6d4f\u89c8\u5668\u6b63\u786e\u6267\u884c\u3002<\/p><\/blockquote>\n\n\n\n<h2 class=\"wp-block-heading\">JavaScript\u6846\u67b6<\/h2>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p><strong>JQuery\uff1a<\/strong>\u5927\u5bb6\u719f\u77e5\u7684JavaScript\u5e93\uff0c\u4f18\u70b9\u5c31\u662f\u7b80\u5316\u4e86DOM\u64cd\u4f5c\uff0c\u7f3a\u70b9\u5c31\u662fDOM\u64cd\u4f5c\u592a\u9891\u7e41\uff0c\u5f71\u54cd\u524d\u7aef\u6027\u80fd\uff1b\u5728\u524d\u7aef\u773c\u91cc\u4f7f\u7528\u5b83\u4ec5\u4ec5\u662f\u4e3a\u4e86\u517c\u5bb9IE6\uff0c7\uff0c8\uff1b<br><strong>Angular\uff1a<\/strong>Google\u6536\u8d2d\u7684\u524d\u7aef\u6846\u67b6\uff0c\u7531\u4e00\u7fa4Java\u7a0b\u5e8f\u5458\u5f00\u53d1\uff0c\u5176\u7279\u70b9\u662f\u5c06\u540e\u53f0\u7684MVC\u6a21\u5f0f\u642c\u5230\u4e86\u524d\u7aef\u5e76\u589e\u52a0\u4e86\u6a21\u5757\u5316\u5f00\u53d1\u7684\u7406\u5ff5\uff0c\u4e0e\u5fae\u8f6f\u5408\u4f5c\uff0c\u91c7\u7528\u4e86TypeScript\u8bed\u6cd5\u5f00\u53d1\uff1b\u5bf9\u540e\u53f0\u7a0b\u5e8f\u5458\u53cb\u597d\uff0c\u5bf9\u524d\u7aef\u7a0b\u5e8f\u5458\u4e0d\u592a\u53cb\u597d\uff1b\u6700\u5927\u7684\u7f3a\u70b9\u662f\u7248\u672c\u8fed\u4ee3\u4e0d\u5408\u7406\uff08\u59821\u4ee3\u2013&gt;2 \u4ee3\uff0c\u9664\u4e86\u540d\u5b57\uff0c\u57fa\u672c\u5c31\u662f\u4e24\u4e2a\u4e1c\u897f\uff1b\u622a\u6b62\u53d1\u8868\u535a\u5ba2\u65f6\u5df2\u63a8\u51fa\u4e86Angular6\uff09<br><strong>React\uff1a<\/strong>Facebook \u51fa\u54c1\uff0c\u4e00\u6b3e\u9ad8\u6027\u80fd\u7684JS\u524d\u7aef\u6846\u67b6\uff1b\u7279\u70b9\u662f\u63d0\u51fa\u4e86\u65b0\u6982\u5ff5 \u3010\u865a\u62dfDOM\u3011\u7528\u4e8e\u51cf\u5c11\u771f\u5b9e DOM \u64cd\u4f5c\uff0c\u5728\u5185\u5b58\u4e2d\u6a21\u62df DOM\u64cd\u4f5c\uff0c\u6709\u6548\u7684\u63d0\u5347\u4e86\u524d\u7aef\u6e32\u67d3\u6548\u7387\uff1b\u7f3a\u70b9\u662f\u4f7f\u7528\u590d\u6742\uff0c\u56e0\u4e3a\u9700\u8981\u989d\u5916\u5b66\u4e60\u4e00\u95e8\u3010JSX\u3011\u8bed\u8a00\uff1b<br><strong>Vue\uff1a<\/strong>\u4e00\u6b3e\u6e10\u8fdb\u5f0f JavaScript \u6846\u67b6\uff0c\u6240\u8c13\u6e10\u8fdb\u5f0f\u5c31\u662f\u9010\u6b65\u5b9e\u73b0\u65b0\u7279\u6027\u7684\u610f\u601d\uff0c\u5982\u5b9e\u73b0\u6a21\u5757\u5316\u5f00\u53d1\u3001\u8def\u7531\u3001\u72b6\u6001\u7ba1\u7406\u7b49\u65b0\u7279\u6027\u3002\u5176\u7279\u70b9\u662f\u7efc\u5408\u4e86 Angular\uff08\u6a21\u5757\u5316\uff09\u548cReact(\u865a\u62df DOM) \u7684\u4f18\u70b9\uff1b<br><strong>Axios\uff1a<\/strong>\u524d\u7aef\u901a\u4fe1\u6846\u67b6\uff1b\u56e0\u4e3a Vue \u7684\u8fb9\u754c\u5f88\u660e\u786e\uff0c\u5c31\u662f\u4e3a\u4e86\u5904\u7406 DOM\uff0c\u6240\u4ee5\u5e76\u4e0d\u5177\u5907\u901a\u4fe1\u80fd\u529b\uff0c\u6b64\u65f6\u5c31\u9700\u8981\u989d\u5916\u4f7f\u7528\u4e00\u4e2a\u901a\u4fe1\u6846\u67b6\u4e0e\u670d\u52a1\u5668\u4ea4\u4e92\uff1b\u5f53\u7136\u4e5f\u53ef\u4ee5\u76f4\u63a5\u9009\u62e9\u4f7f\u7528jQuery \u63d0\u4f9b\u7684AJAX \u901a\u4fe1\u529f\u80fd\uff1b<br><\/p><\/blockquote>\n\n\n\n<h2 class=\"wp-block-heading\">\u4e8c\u3001Vue.js\u4e3b\u6d41\u6846\u67b6\u5b66\u4e60<\/h2>\n\n\n\n<h2 class=\"wp-block-heading\">iView<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>iview\u662f\u4e00\u4e2a\u5f3a\u5927\u7684\u57fa\u4e8eVue\u7684UI\u5e93\uff0c \u6709\u5f88\u591a\u5b9e\u7528\u7684\u57fa\u7840\u7ec4\u4ef6\u6bd4element ui\u7684\u7ec4\u4ef6\u66f4\u4e30\u5bcc\uff0c \u4e3b\u8981\u670d\u52a1\u4e8ePC\u754c\u9762\u7684\u4e2d\u540e\u53f0\u4ea7\u54c1\u3002\u4f7f\u7528\u5355\u6587\u4ef6\u7684Vue\u7ec4\u4ef6\u5316\u5f00\u53d1\u6a21\u5f0f\u57fa\u4e8enpm+webpack+babel\u5f00\u53d1\uff0c \u652f\u6301ES 2015\u9ad8\u8d28\u91cf\u3001\u529f\u80fd\u4e30\u5bcc\u53cb\u597d\u7684API\uff0c \u81ea\u7531\u7075\u6d3b\u5730\u4f7f\u7528\u7a7a\u95f4\u3002<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">\u5b98\u7f51\u5730\u5740<\/h2>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>Github<br>iview-admin<br>\u5907\u6ce8\uff1a\u5c5e\u4e8e\u524d\u7aef\u4e3b\u6d41\u6846\u67b6\uff0c\u9009\u578b\u65f6\u53ef\u8003\u8651\u4f7f\u7528\uff0c\u4e3b\u8981\u7279\u70b9\u662f\u79fb\u52a8\u7aef\u652f\u6301\u8f83\u591a<\/p><\/blockquote>\n\n\n\n<h2 class=\"wp-block-heading\">Element UI<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>Element\u662f\u997f\u4e86\u4e48\u524d\u7aef\u5f00\u6e90\u7ef4\u62a4\u7684Vue UI\u7ec4\u4ef6\u5e93\uff0c \u7ec4\u4ef6\u9f50\u5168\uff0c \u57fa\u672c\u6db5\u76d6\u540e\u53f0\u6240\u9700\u7684\u6240\u6709\u7ec4\u4ef6\uff0c\u6587\u6863\u8bb2\u89e3\u8be6\u7ec6\uff0c \u4f8b\u5b50\u4e5f\u5f88\u4e30\u5bcc\u3002\u4e3b\u8981\u7528\u4e8e\u5f00\u53d1PC\u7aef\u7684\u9875\u9762\uff0c \u662f\u4e00\u4e2a\u8d28\u91cf\u6bd4\u8f83\u9ad8\u7684Vue UI\u7ec4\u4ef6\u5e93\u3002<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">\u5b98\u7f51\u5730\u5740<\/h2>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>\u00b7Git hub<br>\u00b7vue-element-admin<br>\u5907\u6ce8\uff1a\u5c5e\u4e8e\u524d\u7aef\u4e3b\u6d41\u6846\u67b6\uff0c\u9009\u578b\u65f6\u53ef\u8003\u8651\u4f7f\u7528\uff0c\u4e3b\u8981\u7279\u70b9\u662f\u684c\u9762\u7aef\u652f\u6301\u8f83\u591a<\/p><\/blockquote>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u4e09\u3001\u7b2c\u4e00\u4e2aVue\u7a0b\u5e8f<\/h2>\n\n\n\n<h2 class=\"wp-block-heading\">1\u3001<strong>\u521b\u5efa\u4e00\u4e2aHTML\u6587\u4ef6<\/strong><\/h2>\n\n\n\n<pre class=\"wp-block-code has-normal-font-size\"><code><span class=\"has-inline-color has-black-color\"><strong>&lt;!DOCTYPE html&gt;\n&lt;html lang=\"en\"&gt;\n&lt;head&gt;\n    &lt;meta charset=\"UTF-8\"&gt;\n    &lt;title&gt;Title&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n<\/strong>\n<strong>\n&lt;\/body&gt;\n&lt;\/html&gt;<\/strong><\/span><\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">2\u3001<strong>\u5f15\u5165Vue.js<\/strong><\/h2>\n\n\n\n<pre class=\"wp-block-code has-normal-font-size\"><code><strong><span class=\"has-inline-color has-black-color\">&lt;!--1.\u5bfc\u5165Vue.js--&gt;\n&lt;script src=\"https:\/\/cdn.jsdelivr.net\/npm\/vue@2.5.21\/dist\/vue.min.js\"&gt;&lt;\/script&gt;\n<\/span><\/strong><\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>3\u3001\u521b\u5efa\u4e00\u4e2aVue\u5b9e\u4f8b<\/strong><\/h2>\n\n\n\n<pre class=\"wp-block-code has-normal-font-size\"><code><strong>&lt;script type=\"text\/javascript\"&gt;\n    var vm = new Vue({\n        el:\"#app\",\n        \/*Model\uff1a\u6570\u636e*\/\n        data:{\n            message:\"hello,vue!\"\n        }\n    });\n&lt;\/script&gt;\n<\/strong><\/code><\/pre>\n\n\n\n<ul class=\"wp-block-list\"><li>\u8bf4\u660e\uff1a<\/li><\/ul>\n\n\n\n<blockquote class=\"wp-block-quote is-style-default is-layout-flow wp-block-quote-is-layout-flow\"><p><strong><a href=\"el: '#vue'\uff1a\u7ed1\u5b9a\u5143\u7d20\u7684ID&#10;data:{message:'Hello Vue!'}\uff1a\u6570\u636e\u5bf9\u8c61\u4e2d\u6709\u4e00\u4e2a\u540d\u4e3amessage\u7684\u5c5e\u6027\uff0c\u5e76\u8bbe\u7f6e\u4e86\u521d\u59cb\u503c Hello Vue\uff01\" data-type=\"URL\" data-id=\"el: '#vue'\uff1a\u7ed1\u5b9a\u5143\u7d20\u7684ID\ndata:{message:'Hello Vue!'}\uff1a\u6570\u636e\u5bf9\u8c61\u4e2d\u6709\u4e00\u4e2a\u540d\u4e3amessage\u7684\u5c5e\u6027\uff0c\u5e76\u8bbe\u7f6e\u4e86\u521d\u59cb\u503c Hello Vue\uff01\"><code>el: '#vue'<\/code>\uff1a\u7ed1\u5b9a\u5143\u7d20\u7684ID<\/a><\/strong><\/p><p><strong><a href=\"el: '#vue'\uff1a\u7ed1\u5b9a\u5143\u7d20\u7684ID&#10;data:{message:'Hello Vue!'}\uff1a\u6570\u636e\u5bf9\u8c61\u4e2d\u6709\u4e00\u4e2a\u540d\u4e3amessage\u7684\u5c5e\u6027\uff0c\u5e76\u8bbe\u7f6e\u4e86\u521d\u59cb\u503c Hello Vue\uff01\" data-type=\"URL\" data-id=\"el: '#vue'\uff1a\u7ed1\u5b9a\u5143\u7d20\u7684ID\ndata:{message:'Hello Vue!'}\uff1a\u6570\u636e\u5bf9\u8c61\u4e2d\u6709\u4e00\u4e2a\u540d\u4e3amessage\u7684\u5c5e\u6027\uff0c\u5e76\u8bbe\u7f6e\u4e86\u521d\u59cb\u503c Hello Vue\uff01\"><code>data:{message:'Hello Vue!'}<\/code>\uff1a\u6570\u636e\u5bf9\u8c61\u4e2d\u6709\u4e00\u4e2a\u540d\u4e3amessage\u7684\u5c5e\u6027\uff0c\u5e76\u8bbe\u7f6e\u4e86\u521d\u59cb\u503c Hello Vue\uff01<\/a><\/strong><\/p><\/blockquote>\n\n\n\n<h2 class=\"wp-block-heading\">4\u3001\u5c06\u6570\u636e\u7ed1\u5b9a\u5230\u9875\u9762\u5143\u7d20<\/h2>\n\n\n\n<pre class=\"wp-block-code has-normal-font-size\"><code><strong>&lt;!--view\u5c42\uff0c\u6a21\u677f--&gt;\n&lt;div id=\"app\"&gt;\n    {{message}}\n&lt;\/div&gt;\n<\/strong><\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">5\u3001\u5b8c\u6574Html<\/h2>\n\n\n\n<pre class=\"wp-block-code has-normal-font-size\"><code><strong>&lt;!DOCTYPE html&gt;\n&lt;html lang=\"en\"&gt;\n&lt;head&gt;\n    &lt;meta charset=\"UTF-8\"&gt;\n    &lt;title&gt;Title&lt;\/title&gt;\n\n&lt;\/head&gt;\n&lt;body&gt;\n\n&lt;!--view\u5c42\uff0c\u6a21\u677f--&gt;\n&lt;div id=\"app\"&gt;\n    {{message}}\n&lt;\/div&gt;\n\n&lt;!--1.\u5bfc\u5165Vue.js--&gt;\n&lt;script src=\"https:\/\/cdn.jsdelivr.net\/npm\/vue@2.5.21\/dist\/vue.min.js\"&gt;&lt;\/script&gt;\n&lt;script type=\"text\/javascript\"&gt;\n    var vm = new Vue({\n        el:\"#app\",\n        \/*Model\uff1a\u6570\u636e*\/\n        data:{\n            message:\"hello,vue!\"\n        }\n    });\n&lt;\/script&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/strong><\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">6\u3001\u5b9e\u73b0\u6548\u679c<\/h2>\n\n\n\n<figure class=\"wp-block-gallery columns-1 is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"689\" height=\"350\" src=\"https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/11\/image.png\" alt=\"\" data-id=\"808\" class=\"wp-image-808\" srcset=\"https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/11\/image.png 689w, https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/11\/image-300x152.png 300w\" sizes=\"auto, (max-width: 689px) 100vw, 689px\" \/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u4e00\u3001\u524d\u7aef\u6838\u5fc3\u5206\u6790 1.1\u3001\u6982\u8ff0 Soc\u539f&hellip;<\/p>\n","protected":false},"author":1,"featured_media":216,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[],"class_list":["post-215","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-commercial"],"featured_image_urls":{"full":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x.jpg",820,680,false],"thumbnail":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x-150x150.jpg",150,150,true],"medium":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x-300x249.jpg",300,249,true],"medium_large":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x-768x637.jpg",768,637,true],"large":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x.jpg",820,680,false],"1536x1536":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x.jpg",820,680,false],"2048x2048":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x.jpg",820,680,false],"post-thumbnail":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x.jpg",300,249,false],"master-blog-archive":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x.jpg",367,304,false],"master-blog-single":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x.jpg",773,641,false],"master-blog-thumbnail":["https:\/\/www.jieshop.info\/wp-content\/uploads\/2021\/06\/blog-img-2@2x.jpg",109,90,false]},"post_excerpt_stackable":"<p>\u4e00\u3001\u524d\u7aef\u6838\u5fc3\u5206\u6790 1.1\u3001\u6982\u8ff0 Soc\u539f\u5219\uff1a\u5173\u6ce8\u70b9\u5206\u79bb\u539f\u5219Vue \u7684\u6838\u5fc3\u5e93\u53ea\u5173\u6ce8\u89c6\u56fe\u5c42\uff0c\u65b9\u4fbf\u4e0e\u7b2c\u4e09\u65b9\u5e93\u6216\u65e2\u6709\u9879\u76ee\u6574\u5408\u3002HTML + CSS + JS : \u89c6\u56fe \uff1a \u7ed9\u7528\u6237\u770b\uff0c\u5237\u65b0\u540e\u53f0\u7ed9\u7684\u6570\u636e\u7f51\u7edc\u901a\u4fe1 &hellip;<\/p>\n","category_list":"<a href=\"https:\/\/www.jieshop.info\/?cat=5\" rel=\"category\">Commercial<\/a>","author_info":{"name":"admin","url":"https:\/\/www.jieshop.info\/?author=1"},"comments_num":"0 comments","_links":{"self":[{"href":"https:\/\/www.jieshop.info\/index.php?rest_route=\/wp\/v2\/posts\/215","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.jieshop.info\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jieshop.info\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jieshop.info\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jieshop.info\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=215"}],"version-history":[{"count":3,"href":"https:\/\/www.jieshop.info\/index.php?rest_route=\/wp\/v2\/posts\/215\/revisions"}],"predecessor-version":[{"id":832,"href":"https:\/\/www.jieshop.info\/index.php?rest_route=\/wp\/v2\/posts\/215\/revisions\/832"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.jieshop.info\/index.php?rest_route=\/wp\/v2\/media\/216"}],"wp:attachment":[{"href":"https:\/\/www.jieshop.info\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=215"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jieshop.info\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=215"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jieshop.info\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=215"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}