zan-sku-table - npm Package Compare versions

Comparing version 4.0.0 to 4.0.1

package.json

 {
   "name": "zan-sku-table",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "description": "这是一个React组件",
@@ -5,0 +5,0 @@ "repository": "url/to/your/component",

README.md

 ## zan-sku-table
 
+[![NPM](http://npm.qima-inc.com/badge/v/zan-sku-table.svg?style=flat-square)](http://npm.qima-inc.com/package/zan-sku-table)
+
 这是一个规格表格组件
@@ -11,4 +13,139 @@
 
-请写在本段落
+:::demo 基础用法
+```js
+import SKUTable from 'zan-sku-table';
+import SKU from 'zan-sku';
+import { Input } from 'zent'; 
 
+const columns = [
+  {
+    title: '价格',
+    default: 0,
+    bodyRender(item) {
+      return <Input value={item.price} />;
+    }
+  },
+  {
+    title: '库存',
+    default: 0,
+    bodyRender(item) {
+      return <Input value={item.stock_num} />;
+    }
+  },
+  {
+    title: '商家编码',
+    name: 'code'
+  }
+];
+
+const SKUTree = [
+  {
+    id: 10740,
+    kdt_id: 18884150,
+    text: '你好'
+  },
+  {
+    id: 40732,
+    kdt_id: 18884150,
+    text: 'hhh'
+  },
+  {
+    id: 512521,
+    kdt_id: 18884150,
+    text: 'nihao'
+  },
+  {
+    id: 572390,
+    kdt_id: 18884150,
+    text: '会员期限'
+  },
+  {
+    id: 18496487,
+    kdt_id: 18884150,
+    text: 'channel'
+  },
+  {
+    id: 19610451,
+    kdt_id: 18884150,
+    text: '普通胶水'
+  },
+  {
+    id: 19610484,
+    kdt_id: 18884150,
+    text: '高级胶水'
+  }
+];
+
+const SKULeaf = [
+  {
+    id: 3,
+    text: '蓝色'
+  },
+  {
+    id: 10,
+    text: '红色'
+  },
+  {
+    id: 30,
+    text: '土豪金'
+  },
+  {
+    id: 137,
+    text: '黑色'
+  },
+  {
+    id: 138,
+    text: '灰色'
+  }
+];
+
+
+class Simple extends Component {
+  state = {
+    skuData: []
+  };
+
+  fetchSKUTree() {
+    return new Promise(resolve => {
+      resolve(SKUTree);
+    });
+  }
+
+  fetchSKU() {
+    return new Promise(resolve => {
+      resolve(SKULeaf);
+    });
+  }
+
+  handleSKUChange = data => {
+    this.setState({
+      skuData: [].concat(data)
+    });
+  };
+
+  render() {
+    let { skuData } = this.state;
+
+    return (
+      <div>
+        <SKU
+          value={skuData}
+          onFetchGroup={this.fetchSKUTree}
+          onFetchSKU={this.fetchSKU}
+          onChange={this.handleSKUChange}
+        />
+        <SKUTable data={SKU.flatten(skuData)} columns={columns} />
+      </div>
+    );
+  }
+}
+
+ReactDOM.render(
+    <Simple />
+    , mountNode
+);
+
+```
+:::
+
 ### API
@@ -15,0 +152,0 @@

No alert changes

Improved metrics

Total package byte prevSize

57535

increased by3.87%

Lines of code

1407

increased by0.36%

Number of lines in readme file

159

increased by622.73%

No dependency changes