| 1 |
- import{e as s,o as a,G as t}from"./vendor.9cc7b6f2.js";const n={class:"markdown-body"},p=[t('<h1>Price 商品价格</h1><h3>介绍</h3><p>用来对商品价格数值的小数点前后部分应用不同样式，还支持人民币符号、千位分隔符、设置小数点位数等功能。</p><h3>安装</h3><pre><code class="language-javascript"><span class="hljs-keyword">import</span> { createApp } <span class="hljs-keyword">from</span> <span class="hljs-string">'vue'</span>;\n<span class="hljs-comment">//vue</span>\n<span class="hljs-keyword">import</span> { Price } <span class="hljs-keyword">from</span> <span class="hljs-string">'@nutui/nutui'</span>;\n<span class="hljs-comment">//taro</span>\n<span class="hljs-keyword">import</span> { Price } <span class="hljs-keyword">from</span> <span class="hljs-string">'@nutui/nutui-taro'</span>;\n\n<span class="hljs-keyword">const</span> app = createApp();\napp.use(Price);\n\n</code></pre><h3>基本用法</h3><pre><code class="language-html"><span class="hljs-tag"><<span class="hljs-name">nut-price</span> <span class="hljs-attr">:price</span>=<span class="hljs-string">"1010"</span> <span class="hljs-attr">:need-symbol</span>=<span class="hljs-string">"false"</span> <span class="hljs-attr">:thousands</span>=<span class="hljs-string">"true"</span> /></span>\n</code></pre><h3>有人民币符号，无千位分隔</h3><pre><code class="language-html"><span class="hljs-tag"><<span class="hljs-name">nut-price</span> <span class="hljs-attr">:price</span>=<span class="hljs-string">"10010.01"</span> <span class="hljs-attr">:need-symbol</span>=<span class="hljs-string">"true"</span> <span class="hljs-attr">:thousands</span>=<span class="hljs-string">"false"</span> /></span>\n</code></pre><h3>带人民币符号，有千位分隔，保留小数点后三位</h3><pre><code class="language-html"><span class="hljs-tag"><<span class="hljs-name">nut-price</span> <span class="hljs-attr">:price</span>=<span class="hljs-string">"15213.1221"</span> <span class="hljs-attr">:decimal-digits</span>=<span class="hljs-string">"3"</span> <span class="hljs-attr">:need-symbol</span>=<span class="hljs-string">"true"</span> <span class="hljs-attr">:thousands</span>=<span class="hljs-string">"true"</span> /></span>\n</code></pre><h3>异步随机变更</h3><pre><code class="language-html"><span class="hljs-tag"><<span class="hljs-name">nut-price</span> <span class="hljs-attr">:price</span>=<span class="hljs-string">"price"</span> <span class="hljs-attr">:decimal-digits</span>=<span class="hljs-string">"3"</span> <span class="hljs-attr">:need-symbol</span>=<span class="hljs-string">"true"</span> <span class="hljs-attr">:thousands</span>=<span class="hljs-string">"true"</span> /></span>\n</code></pre><pre><code class="language-javascript"><span class="hljs-function"><span class="hljs-title">setup</span>(<span class="hljs-params"></span>)</span> {\n <span class="hljs-keyword">const</span> price = ref(<span class="hljs-number">0</span>);\n <span class="hljs-built_in">setInterval</span>(<span class="hljs-function">() =></span> {\n price.value = <span class="hljs-built_in">Math</span>.random()*<span class="hljs-number">10000000</span>;\n }, <span class="hljs-number">1000</span>);\n <span class="hljs-keyword">return</span> {\n price\n };\n}\n</code></pre><h3>Prop</h3><table><thead><tr><th>字段</th><th>说明</th><th>类型</th><th>默认值</th></tr></thead><tbody><tr><td>price</td><td>价格数量</td><td>Number</td><td>0</td></tr><tr><td>need-symbol</td><td>是否需要加上 symbol 符号</td><td>Boolean</td><td>true</td></tr><tr><td>symbol</td><td>符号类型</td><td>String</td><td>¥</td></tr><tr><td>decimal-digits</td><td>小数位位数</td><td>Number</td><td>2</td></tr><tr><td>thousands</td><td>是否按照千分号形式显示</td><td>Boolean</td><td>false</td></tr></tbody></table>',16)],l={setup:(t,{expose:l})=>(l({frontmatter:{}}),(t,l)=>(a(),s("div",n,p)))};export{l as default};
|
