{"id":5476,"date":"2024-09-13T14:01:01","date_gmt":"2024-09-13T06:01:01","guid":{"rendered":""},"modified":"2024-09-13T14:01:01","modified_gmt":"2024-09-13T06:01:01","slug":"js\u6c49\u5b57\u8f6c\u62fc\u97f3 vue\u63d2\u4ef6_\u6c49\u5b57\u81ea\u52a8\u751f\u6210\u62fc\u97f3\u8f6f\u4ef6","status":"publish","type":"post","link":"https:\/\/mushiming.com\/5476.html","title":{"rendered":"js\u6c49\u5b57\u8f6c\u62fc\u97f3 vue\u63d2\u4ef6_\u6c49\u5b57\u81ea\u52a8\u751f\u6210\u62fc\u97f3\u8f6f\u4ef6"},"content":{"rendered":"<p><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"display: none;\"> \n <path stroke-linecap=\"round\" d=\"M5,0 0,2.5 5,5z\" id=\"raphael-marker-block\" style=\"-webkit-tap-highlight-color: rgba(0, 0, 0, 0);\"><\/path> \n<\/svg> <\/p>\n<p>\u4e00\u822c\u5b9e\u73b0\u6c49\u5b57\u8f6c\u62fc\u97f3\u7684\u529f\u80fd\u90fd\u662f\u8bf7\u6c42\u670d\u52a1\u7aef api \u5b9e\u73b0\uff0c\u800c\u5bf9\u4e8e\u4e00\u4e9b\u6bd4\u8f83\u7b80\u5355\u7684\u9700\u6c42\uff0c\u6211\u4eec\u53ef\u4ee5\u901a\u8fc7\u4e00\u4e2a npm \u5de5\u5177\u5305 \u2014\u2014 pinyin-pro \uff0c\u7eaf\u524d\u7aef\u5b9e\u73b0\u4e2d\u6587\u6c49\u5b57\u8f6c\u62fc\u97f3\u7684\u529f\u80fd\u3002<\/p>\n<h3>\u7279\u8272\u529f\u80fd<\/h3>\n<ul>\n<li>\u652f\u6301\u6c49\u5b57\u3001\u8bcd\u8bed\u3001\u53e5\u5b50\u591a\u79cd\u683c\u5f0f\u8f93\u5165\u83b7\u53d6<\/li>\n<li>\u83b7\u53d6\u62fc\u97f3<\/li>\n<li>\u83b7\u53d6\u58f0\u6bcd<\/li>\n<li>\u83b7\u53d6\u97f5\u6bcd<\/li>\n<li>\u83b7\u53d6\u62fc\u97f3\u9996\u5b57\u6bcd<\/li>\n<li>\u83b7\u53d6\u97f3\u8c03<\/li>\n<li>\u83b7\u53d6\u591a\u97f3\u5b57\u7684\u591a\u79cd\u62fc\u97f3<\/li>\n<li>\u652f\u6301\u4eba\u540d\u59d3\u6c0f\u6a21\u5f0f<\/li>\n<li>\u652f\u6301\u81ea\u5b9a\u4e49\u62fc\u97f3<\/li>\n<li>\u652f\u6301\u5b57\u7b26\u4e32\u548c\u6570\u7ec4\u4e24\u79cd\u8f93\u51fa\u5f62\u5f0f<\/li>\n<\/ul>\n<h3>\u7248\u672c\u66f4\u65b0<\/h3>\n<p>\u5f53\u524d\u7248\u672c\uff1a 3.3.1 -&gt; 3.4.0<\/p>\n<ul>\n<li>\u65b0\u589e\u529f\u80fd\n<ul>\n<li>\u652f\u6301\u59d3\u6c0f\u6a21\u5f0f\u62fc\u97f3\u8bc6\u522b\uff0c\u5177\u4f53\u7528\u6cd5\u89c1\u59d3\u6c0f\u6a21\u5f0f<\/li>\n<li>\u652f\u6301\u81ea\u5b9a\u4e49\u62fc\u97f3\u529f\u80fd\uff0c\u5177\u4f53\u7528\u6cd5\u89c1\u81ea\u5b9a\u4e49\u62fc\u97f3<\/li>\n<\/ul>\n<\/li>\n<li>\u95ee\u9898\u4fee\u590d<br \/> \u4fee\u590d\u6587\u672c\u8fc7\u957f\u65f6\u5806\u6808\u6ea2\u51fa\u95ee\u9898<\/li>\n<li>\u5b57\u97f3\u6821\u51c6\n<ul>\n<li>\u891a: \u2018zh\u01d4\u2019 -&gt; \u2018ch\u01d4 zh\u01d4\u2019<\/li>\n<li>\u4fde: \u2018y\u00f9\u2019 -&gt; \u2018y\u00fa y\u00f9\u2019<\/li>\n<li>\u81e7: \u2018z\u00e0ng\u2019 -&gt; \u2018z\u0101ng\u2019<\/li>\n<li>\u8d32: \u2018b\u00ec\u2019 -&gt; \u2018b\u0113n b\u00ec\u2019<\/li>\n<li>\u8398: \u2018x\u012bn\u2019 -&gt; \u2018sh\u0113n x\u012bn\u2019<\/li>\n<li>\u90e6: \u2018zh\u00ed\u2019 -&gt; \u2018l\u00ec zh\u00ed\u2019<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>\u70b9\u51fb\u67e5\u770b \u7248\u672c\u66f4\u65b0\u6587\u6863<\/p>\n<h3>\u5b89\u88c5<\/h3>\n<p>npm \u5b89\u88c5<\/p>\n<pre class=\"language-java prettyprint linenums\"><code>npm install pinyin-pro <\/code><\/pre>\n<p>yarn \u5b89\u88c5<\/p>\n<pre class=\"language-java prettyprint linenums\"><code>yarn add pinyin-pro <\/code><\/pre>\n<h3>\u5f15\u5165<\/h3>\n<p>\u6d4f\u89c8\u5668 script \u5f15\u5165:<\/p>\n<pre><code class=\"prism language-html\"><span class=\"token comment\">&lt;!--\u5f15\u5165\u67d0\u4e2a\u7248\u672c\uff0c\u59823.3.0\u7248\u672c--&gt;<\/span> <span class=\"token comment\">&lt;!-- &lt;script src=\"https:\/\/cdn.jsdelivr.net\/gh\/zh-lx\/pinyin-pro@3.3.0\/dist\/pinyin-pro.js\"&gt;&lt;\/script&gt; --&gt;<\/span> <span class=\"token comment\">&lt;!--\u5f15\u5165\u6700\u65b0\u7248\u672c--&gt;<\/span> <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;<\/span>script<\/span> <span class=\"token attr-name\">src<\/span><span class=\"token attr-value\"><span class=\"token punctuation attr-equals\">=<\/span><span class=\"token punctuation\">\"<\/span>https:\/\/cdn.jsdelivr.net\/gh\/zh-lx\/pinyin-pro@latest\/dist\/pinyin-pro.js<span class=\"token punctuation\">\"<\/span><\/span><span class=\"token punctuation\">&gt;<\/span><\/span><span class=\"token script\"><\/span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;\/<\/span>script<\/span><span class=\"token punctuation\">&gt;<\/span><\/span> <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;<\/span>script<\/span><span class=\"token punctuation\">&gt;<\/span><\/span><span class=\"token script\"><span class=\"token language-javascript\"> <span class=\"token keyword\">var<\/span> <span class=\"token punctuation\">{ \n     <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token operator\">=<\/span> pinyinPro<span class=\"token punctuation\">;<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'h\u00e0n y\u01d4 p\u012bn y\u012bn'<\/span> <\/span><\/span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;\/<\/span>script<\/span><span class=\"token punctuation\">&gt;<\/span><\/span> <\/code><\/pre>\n<p>ESModule \u5f15\u5165\uff1a<\/p>\n<pre><code class=\"prism language-javascript\"><span class=\"token keyword\">import<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">from<\/span> <span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'h\u00e0n y\u01d4 p\u012bn y\u012bn'<\/span> <\/code><\/pre>\n<p>commonjs \u5f15\u5165\uff1a<\/p>\n<pre><code class=\"prism language-javascript\"><span class=\"token keyword\">const<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token operator\">=<\/span> <span class=\"token function\">require<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'h\u00e0n y\u01d4 p\u012bn y\u012bn'<\/span> <\/code><\/pre>\n<h3>\u53c2\u6570<\/h3>\n<p><code>pinyin(word, options)<\/code> \u63a5\u6536\u4e24\u4e2a\u53c2\u6570<\/p>\n<ul>\n<li><b>word\uff1a<\/b>\u5fc5\u586b\u3002String \u7c7b\u578b\uff0c\u9700\u8981\u8f6c\u5316\u4e3a\u62fc\u97f3\u7684\u4e2d\u6587<\/li>\n<li><b>options\uff1a<\/b>\u53ef\u9009\u3002Object \u7c7b\u578b\uff0c\u7528\u4e8e\u914d\u7f6e\u5404\u79cd\u8f93\u51fa\u5f62\u5f0f\uff0coptions \u7684\u952e\u503c\u914d\u7f6e\u5982\u4e0b\uff1a<\/li>\n<\/ul>\n<table>\n<thead>\n<tr>\n<th>\u53c2\u6570<\/th>\n<th>\u8bf4\u660e<\/th>\n<th>\u7c7b\u578b<\/th>\n<th>\u53ef\u9009\u503c<\/th>\n<th>\u9ed8\u8ba4\u503c<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>pattern<\/td>\n<td>\u8f93\u51fa\u7684\u7ed3\u679c\u7684\u4fe1\u606f\uff08\u62fc\u97f3 \/ \u58f0\u6bcd \/ \u97f5\u6bcd \/ \u97f3\u8c03 \/ \u9996\u5b57\u6bcd\uff09<\/td>\n<td>string<\/td>\n<td>pinyin \/ initial \/ final \/ num \/ first<\/td>\n<td>pinyin<\/td>\n<\/tr>\n<tr>\n<td>toneType<\/td>\n<td>\u97f3\u8c03\u8f93\u51fa\u5f62\u5f0f(\u62fc\u97f3\u7b26\u53f7 \/ \u6570\u5b57 \/ \u4e0d\u52a0\u97f3\u8c03)<\/td>\n<td>string<\/td>\n<td>symbol \/ num \/ none<\/td>\n<td>symbol<\/td>\n<\/tr>\n<tr>\n<td>type<\/td>\n<td>\u8f93\u51fa\u7ed3\u679c\u7c7b\u578b\uff08\u5b57\u7b26\u4e32\/\u6570\u7ec4\uff09<\/td>\n<td>string<\/td>\n<td>string \/ array<\/td>\n<td>string<\/td>\n<\/tr>\n<tr>\n<td>multiple<\/td>\n<td>\u8f93\u51fa\u591a\u97f3\u5b57\u5168\u90e8\u62fc\u97f3\uff08\u4ec5\u5728 word \u4e3a\u957f\u5ea6\u4e3a 1 \u7684\u6c49\u5b57\u5b57\u7b26\u4e32\u65f6\u751f\u6548\uff09<\/td>\n<td>boolean<\/td>\n<td>true \/ false<\/td>\n<td>false<\/td>\n<\/tr>\n<tr>\n<td>mode<\/td>\n<td>\u62fc\u97f3\u67e5\u627e\u7684\u6a21\u5f0f\uff08\u5e38\u89c4\u6a21\u5f0f \/ \u59d3\u6c0f\u6a21\u5f0f\uff09<\/td>\n<td>string<\/td>\n<td>normal \/ surname<\/td>\n<td>normal<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h3>\u4f7f\u7528\u793a\u4f8b<\/h3>\n<h4>\u83b7\u53d6\u62fc\u97f3<\/h4>\n<pre><code class=\"prism language-js\"><span class=\"token keyword\">import<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">from<\/span> <span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u5e26\u97f3\u8c03\u62fc\u97f3<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'h\u00e0n y\u01d4 p\u012bn y\u012bn'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u4e0d\u5e26\u58f0\u8c03\u7684\u62fc\u97f3<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'none'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'han yu pin yin'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u58f0\u8c03\u8f6c\u6362\u4e3a\u6570\u5b57\u540e\u7f00\u7684\u62fc\u97f3<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'num'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'han4 yu3 pin1 yin1'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u5e26\u97f3\u8c03\u62fc\u97f3<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ [\"h\u00e0n\", \"y\u01d4\", \"p\u012bn\", \"y\u012bn\"]<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u4e0d\u5e26\u58f0\u8c03\u7684\u62fc\u97f3<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'none'<\/span><span class=\"token punctuation\">,<\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ [\"han\", \"yu\", \"pin\", \"yin\"]<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u58f0\u8c03\u8f6c\u6362\u4e3a\u6570\u5b57\u540e\u7f00\u7684\u62fc\u97f3<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'num'<\/span><span class=\"token punctuation\">,<\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ [\"han4\", \"yu3\", \"pin1\", \"yin1\"]<\/span> <\/code><\/pre>\n<h4>\u83b7\u53d6\u58f0\u6bcd<\/h4>\n<pre><code class=\"prism language-js\"><span class=\"token keyword\">import<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">from<\/span> <span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u58f0\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'initial'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'h y p y'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u58f0\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'initial'<\/span><span class=\"token punctuation\">,<\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ [\"h\", \"y\", \"p\", \"y\"]<\/span> <\/code><\/pre>\n<h4>\u83b7\u53d6\u97f5\u6bcd<\/h4>\n<pre><code class=\"prism language-js\"><span class=\"token keyword\">import<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">from<\/span> <span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u5e26\u97f3\u8c03\u97f5\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'final'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ '\u00e0n \u01d4 \u012bn \u012bn'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u4e0d\u5e26\u97f3\u8c03\u97f5\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'final'<\/span><span class=\"token punctuation\">,<\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'none'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'an u in in'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u97f3\u8c03\u4e3a\u6570\u5b57\u7684\u97f5\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'final'<\/span><span class=\"token punctuation\">,<\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'num'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'an4 u3 in1 in1'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u5e26\u97f3\u8c03\u97f5\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'final'<\/span><span class=\"token punctuation\">,<\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ [\"\u00e0n\", \"\u01d4\", \"\u012bn\", \"\u012bn\"]<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u4e0d\u5e26\u97f3\u8c03\u97f5\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'final'<\/span><span class=\"token punctuation\">,<\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'none'<\/span><span class=\"token punctuation\">,<\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ [\"an\", \"u\", \"in\", \"in\"]<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u97f3\u8c03\u4e3a\u6570\u5b57\u7684\u97f5\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'final'<\/span><span class=\"token punctuation\">,<\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'num'<\/span><span class=\"token punctuation\">,<\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ ['an4', 'u3', 'in1', 'in1']<\/span> <\/code><\/pre>\n<h4>\u83b7\u53d6\u97f3\u8c03<\/h4>\n<pre><code class=\"prism language-js\"><span class=\"token keyword\">import<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">from<\/span> <span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u97f3\u8c03<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'num'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ '4 3 1 1'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u97f3\u8c03<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6c49\u8bed\u62fc\u97f3'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'num'<\/span><span class=\"token punctuation\">,<\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ [\"4\", \"3\", \"1\", \"1\"]<\/span> <\/code><\/pre>\n<h4>\u83b7\u53d6\u62fc\u97f3\u9996\u5b57\u6bcd<\/h4>\n<pre><code class=\"prism language-js\"><span class=\"token keyword\">import<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">from<\/span> <span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u62fc\u97f3\u9996\u5b57\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u8d75\u94b1\u5b59\u674e\u989d'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'first'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'z q s l \u00e9'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u4e0d\u5e26\u97f3\u8c03\u62fc\u97f3\u9996\u5b57\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u8d75\u94b1\u5b59\u674e\u989d'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'first'<\/span><span class=\"token punctuation\">,<\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'none'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'z q s l e'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u62fc\u97f3\u9996\u5b57\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u8d75\u94b1\u5b59\u674e\u989d'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'first'<\/span><span class=\"token punctuation\">,<\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ ['z', 'q', 's', 'l', '\u00e9']<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u4e0d\u5e26\u97f3\u8c03\u62fc\u97f3\u9996\u5b57\u6bcd<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u8d75\u94b1\u5b59\u674e\u989d'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pattern<span class=\"token operator\">:<\/span> <span class=\"token string\">'first'<\/span><span class=\"token punctuation\">,<\/span> toneType<span class=\"token operator\">:<\/span> <span class=\"token string\">'none'<\/span>\uff0c type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ ['z', 'q', 's', 'l', 'e']<\/span> <\/code><\/pre>\n<h4>\u83b7\u53d6\u5355\u4e2a\u5b57\u7684\u591a\u97f3<\/h4>\n<p>\u53ea\u6709\u5355\u5b57\u53ef\u4ee5\u83b7\u53d6\u5230\u591a\u97f3\u6a21\u5f0f, \u8bcd\u8bed\u3001\u53e5\u5b50\u65e0\u6548\u3002\u540c\u6837\u53ef\u4ee5\u901a\u8fc7\u914d\u7f6e options \u9009\u9879\u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u3001\u97f5\u6bcd\u7b49\u683c\u5f0f<\/p>\n<pre><code class=\"prism language-javascript\"><span class=\"token keyword\">import<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">from<\/span> <span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u591a\u97f3<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u597d'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> multiple<span class=\"token operator\">:<\/span> <span class=\"token boolean\">true<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'h\u01ceo h\u00e0o'<\/span> <span class=\"token comment\">\/\/ \u83b7\u53d6\u6570\u7ec4\u5f62\u5f0f\u591a\u97f3<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u597d'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> multiple<span class=\"token operator\">:<\/span> <span class=\"token boolean\">true<\/span><span class=\"token punctuation\">,<\/span> type<span class=\"token operator\">:<\/span> <span class=\"token string\">'array'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ [\"h\u01ceo\", \"h\u00e0o\"]<\/span> <\/code><\/pre>\n<h4>\u59d3\u6c0f\u6a21\u5f0f<\/h4>\n<p>\u901a\u8fc7\u8bbe\u7f6e <code>mode: 'surname'<\/code> \u5f00\u542f\u59d3\u6c0f\u6a21\u5f0f\u540e\uff0c\u5339\u914d\u5230\u767e\u5bb6\u59d3\u4e2d\u7684\u59d3\u6c0f\u4f18\u5148\u8f93\u51fa\u59d3\u6c0f\u62fc\u97f3<\/p>\n<pre><code class=\"prism language-javascript\"><span class=\"token keyword\">import<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">from<\/span> <span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ \u4e0d\u5f00\u542f\u59d3\u6c0f\u6a21\u5f0f<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6211\u53eb\u66fe\u5c0f\u8d24'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'w\u01d2 ji\u00e0o c\u00e9ng xi\u01ceo xi\u00e1n'<\/span> <span class=\"token comment\">\/\/ \u5f00\u542f\u59d3\u6c0f\u6a21\u5f0f<\/span> <span class=\"token function\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u6211\u53eb\u66fe\u5c0f\u8d24'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> mode<span class=\"token operator\">:<\/span> <span class=\"token string\">'surname'<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'w\u01d2 ji\u00e0o z\u0113ng xi\u01ceo xi\u00e1n'<\/span> <\/code><\/pre>\n<h4>\u81ea\u5b9a\u4e49\u62fc\u97f3<\/h4>\n<p>\u5305\u5185\u90e8\u5bfc\u51fa\u4e86 <code>customPinyin<\/code> \u65b9\u6cd5\uff0c\u652f\u6301\u7528\u6237\u81ea\u5b9a\u4e49\u8bbe\u7f6e\u8bcd\u53e5\u62fc\u97f3\uff0c\u5f53\u4e2d\u6587\u4e2d\u5339\u914d\u7528\u6237\u81ea\u5df1\u5b9a\u4e49\u7684\u8bcd\u53e5\u62fc\u97f3\u65f6\uff0c\u4f18\u5148\u4f7f\u7528\u7528\u6237\u81ea\u5b9a\u4e49\u7684\u8bcd\u53e5\u62fc\u97f3<\/p>\n<pre><code class=\"prism language-javascript\"><span class=\"token keyword\">import<\/span> <span class=\"token punctuation\">{ \n   <!-- --><\/span> pinyin<span class=\"token punctuation\">,<\/span> customPinyin <span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">from<\/span> <span class=\"token string\">'pinyin-pro'<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token function\">customPinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{ \n   <!-- --><\/span> \u5e72\u4e00\u884c\u884c\u4e00\u884c<span class=\"token operator\">:<\/span> <span class=\"token string\">'g\u00e0n y\u012b h\u00e1ng x\u00edng y\u012b h\u00e1ng'<\/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\">pinyin<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'\u5e72\u4e00\u884c\u884c\u4e00\u884c'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span> <span class=\"token comment\">\/\/ 'g\u00e0n y\u012b h\u00e1ng x\u00edng y\u012b h\u00e1ng'<\/span> <\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"js\u6c49\u5b57\u8f6c\u62fc\u97f3 vue\u63d2\u4ef6_\u6c49\u5b57\u81ea\u52a8\u751f\u6210\u62fc\u97f3\u8f6f\u4ef6\u4e00\u822c\u5b9e\u73b0\u6c49\u5b57\u8f6c\u62fc\u97f3\u7684\u529f\u80fd\u90fd\u662f\u8bf7\u6c42\u670d\u52a1\u7aefapi\u5b9e\u73b0\uff0c\u800c\u5bf9\u4e8e\u4e00\u4e9b\u6bd4\u8f83\u7b80\u5355\u7684\u9700\u6c42\uff0c\u6211...","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"_links":{"self":[{"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/posts\/5476"}],"collection":[{"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/comments?post=5476"}],"version-history":[{"count":0,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/posts\/5476\/revisions"}],"wp:attachment":[{"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/media?parent=5476"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/categories?post=5476"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/tags?post=5476"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}