117-9c128e7e1f8e9241073d.js

(window.webpackJsonp=window.webpackJsonp||[]).push([[117],{946:function(t,n,d){"use strict";d.r(n),d.d(n,"default",(function(){return E}));var e=d(840),r=d.n(e),o=d(841),a=d.n(o),c=d(521),i=d.n(c),s=d(842),u=d.n(s),h=d(843),l=d.n(h),f=d(844),p=d.n(f),m=d(845),g=d.n(m),y=d(846),v=d.n(y),k=d(0),b=d.n(k),x=d(210);function j(t){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],(function(){}))),!0}catch(t){return!1}}();return function(){var d,e=p()(t);if(n){var r=p()(this).constructor;d=Reflect.construct(e,arguments,r)}else d=e.apply(this,arguments);return l()(this,d)}}function S(t){return b.a.createElement(t.tag,v()({},t.attributes,{dangerouslySetInnerHTML:{__html:t.html}}))}function T(t){return b.a.createElement(S,{tag:"section",html:t.html,attributes:{className:"zandoc-react-markdown"}})}function w(t){return b.a.createElement(S,{tag:"style",html:t.style})}k.Component;var E=function(t){u()(d,t);var n=j(d);function d(){return r()(this,d),n.apply(this,arguments)}return a()(d,[{key:"componentDidMount",value:function(){var t=location.hash;if(t){var n=document.querySelector('a[href="'.concat(t,'"]'));n&&Object(x.a)(document.documentElement,0,function t(n,d){for(;n;)return n.offsetTop&&"static"!==getComputedStyle(n).position&&(d+=n.offsetTop),t(n.parentNode,d);return d}(n,-9))}}},{key:"render",value:function(){return b.a.createElement("div",{className:"zandoc-react-container",key:null},b.a.createElement(w,{style:""}),b.a.createElement(T,{html:'<h2 class="anchor-heading"><a href="#sku-gui-ge-xuan-ze-qi-yi-fei-qi">¶</a><a href="javascript:void(0)" id="sku-gui-ge-xuan-ze-qi-yi-fei-qi" class="anchor-point"></a>SKU 规格选择器(已废弃)</h2>\n<p><strong>请使用 <code>@zent/sku</code> 这个包。</strong></p>\n<p>这是一个规格选择组件。</p>\n<h3 class="anchor-heading"><a href="#shi-yong-chang-jing">¶</a><a href="javascript:void(0)" id="shi-yong-chang-jing" class="anchor-point"></a>使用场景</h3>\n<p>创建有多种规格的商品、服务的编辑页面</p>\n<h3 class="anchor-heading"><a href="#api">¶</a><a href="javascript:void(0)" id="api" class="anchor-point"></a>API</h3>\n<table class="table">\n<thead>\n<tr>\n<th>参数</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n<th>备选值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>className</td>\n<td>自定义额外类名</td>\n<td>string</td>\n<td><code>\'\'</code></td>\n<td></td>\n</tr>\n<tr>\n<td>value</td>\n<td>当前选中的sku列表</td>\n<td>array</td>\n<td><code>[]</code></td>\n<td></td>\n</tr>\n<tr>\n<td>maxSize</td>\n<td>最大规格名称数</td>\n<td>number</td>\n<td><code>3</code></td>\n<td></td>\n</tr>\n<tr>\n<td>maxSKUTextLength</td>\n<td>规格名称文字最大长度</td>\n<td>number</td>\n<td><code>4</code></td>\n<td></td>\n</tr>\n<tr>\n<td>maxLeafTextLength</td>\n<td>规格值文字最大长度</td>\n<td>number</td>\n<td><code>20</code></td>\n<td></td>\n</tr>\n<tr>\n<td>skuTree</td>\n<td>可选的规格列表</td>\n<td>array</td>\n<td><code>[]</code></td>\n<td></td>\n</tr>\n<tr>\n<td>optionValue</td>\n<td>自定义sku的id的key值</td>\n<td>string</td>\n<td><code>\'id\'</code></td>\n<td></td>\n</tr>\n<tr>\n<td>optionText</td>\n<td>自定义sku的文案的key值</td>\n<td>string</td>\n<td><code>\'text\'</code></td>\n<td></td>\n</tr>\n<tr>\n<td>onFetchGroup</td>\n<td>异步获取可选的规格列表，如“颜色”、“尺寸”</td>\n<td>function</td>\n<td><code>Promise</code></td>\n<td></td>\n</tr>\n<tr>\n<td>onFetchSKU</td>\n<td>异步获取单个规格可选的值，如“红色”、“蓝色”</td>\n<td>function</td>\n<td><code>Promise</code></td>\n<td></td>\n</tr>\n<tr>\n<td>onCreateGroup</td>\n<td>创建新的规格名，如“星座”</td>\n<td>function</td>\n<td><code>Promise</code></td>\n<td></td>\n</tr>\n<tr>\n<td>onCreateSKU</td>\n<td>创建新的规格值，如“处女座”</td>\n<td>function</td>\n<td><code>Promise</code></td>\n<td></td>\n</tr>\n<tr>\n<td>onChange</td>\n<td>当sku发生改变时的回调，返回值为sku当前value</td>\n<td>function</td>\n<td><code>noop</code></td>\n<td></td>\n</tr>\n<tr>\n<td>prefix</td>\n<td>自定义前缀</td>\n<td>string</td>\n<td>\'rc-sku\'</td>\n<td>null</td>\n</tr>\n</tbody>\n</table>\n<h4 class="anchor-heading"><a href="#gong-ju-fang-fa">¶</a><a href="javascript:void(0)" id="gong-ju-fang-fa" class="anchor-point"></a>工具方法</h4>\n<p>为了更方便操作规格数据，SKU组件提供了一些工具方法</p>\n<h4 class="anchor-heading"><a href="#sku-flatten-sku-items-option">¶</a><a href="javascript:void(0)" id="sku-flatten-sku-items-option" class="anchor-point"></a>SKU.flatten(sku, items, options)</h4>\n<p>通过计算笛卡尔积，将树形的value变成扁平的数组</p>\n<table class="table">\n<thead>\n<tr>\n<th>参数</th>\n<th>说明</th>\n<th>类型</th>\n<th>默认值</th>\n<th>备选值</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>sku</td>\n<td>当前选中规格的value</td>\n<td>array</td>\n<td><code>[]</code></td>\n<td></td>\n</tr>\n<tr>\n<td>items</td>\n<td>当前已存在的数据</td>\n<td>array</td>\n<td><code>[]</code></td>\n<td></td>\n</tr>\n<tr>\n<td>options</td>\n<td>可配置参数</td>\n<td>object</td>\n<td><code>{}</code></td>\n<td><code>optionValue: \'id\', optionText: \'text\'</code></td>\n</tr>\n</tbody>\n</table>'}))}}]),d}(k.Component)}}]);