@uiw/doc 5.0.0-bate-1 → 5.0.0-bate-4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/web/CONTRIBUTORS.svg +8 -6
- package/web/asset-manifest.json +270 -270
- package/web/index.html +1 -1
- package/web/locales/en-US/translation.json +2 -1
- package/web/locales/zh-CN/translation.json +3 -2
- package/web/static/css/{main.7a17942f.css → main.fe418263.css} +2 -2
- package/web/static/css/main.fe418263.css.map +1 -0
- package/web/static/js/1048.0d040676.chunk.js +2 -0
- package/web/static/js/{1048.e1f07ee4.chunk.js.map → 1048.0d040676.chunk.js.map} +1 -1
- package/web/static/js/{1548.8c412fe6.chunk.js → 1067.41839b42.chunk.js} +2 -2
- package/web/static/js/{1067.c19e8202.chunk.js.map → 1067.41839b42.chunk.js.map} +1 -1
- package/web/static/js/{1079.9eb656fd.chunk.js → 1079.cbe3c337.chunk.js} +2 -2
- package/web/static/js/{1079.9eb656fd.chunk.js.map → 1079.cbe3c337.chunk.js.map} +1 -1
- package/web/static/js/{1175.f47ae2f8.chunk.js → 1175.75718ca2.chunk.js} +2 -2
- package/web/static/js/{1175.f47ae2f8.chunk.js.map → 1175.75718ca2.chunk.js.map} +1 -1
- package/web/static/js/{1451.04b08f8d.chunk.js → 1451.67001d37.chunk.js} +2 -2
- package/web/static/js/{1451.04b08f8d.chunk.js.map → 1451.67001d37.chunk.js.map} +1 -1
- package/web/static/js/{1515.f35892bb.chunk.js → 1515.72604c10.chunk.js} +2 -2
- package/web/static/js/{1515.f35892bb.chunk.js.map → 1515.72604c10.chunk.js.map} +1 -1
- package/web/static/js/1548.018a20c4.chunk.js +2 -0
- package/web/static/js/{1548.8c412fe6.chunk.js.map → 1548.018a20c4.chunk.js.map} +1 -1
- package/web/static/js/{2810.5d785d11.chunk.js → 1574.d3a9d662.chunk.js} +2 -2
- package/web/static/js/{1574.2b98b114.chunk.js.map → 1574.d3a9d662.chunk.js.map} +1 -1
- package/web/static/js/{1643.ccbaaea6.chunk.js → 1643.cc6714c1.chunk.js} +2 -2
- package/web/static/js/{1643.ccbaaea6.chunk.js.map → 1643.cc6714c1.chunk.js.map} +1 -1
- package/web/static/js/1661.cd44eece.chunk.js +2 -0
- package/web/static/js/{1661.f881ca84.chunk.js.map → 1661.cd44eece.chunk.js.map} +1 -1
- package/web/static/js/{1750.9969beaa.chunk.js → 1750.0eee1f45.chunk.js} +2 -2
- package/web/static/js/{1750.9969beaa.chunk.js.map → 1750.0eee1f45.chunk.js.map} +1 -1
- package/web/static/js/1876.410e32df.chunk.js +2 -0
- package/web/static/js/{1876.6cad539d.chunk.js.map → 1876.410e32df.chunk.js.map} +1 -1
- package/web/static/js/1892.01e73135.chunk.js +2 -0
- package/web/static/js/{1892.dce494f3.chunk.js.map → 1892.01e73135.chunk.js.map} +1 -1
- package/web/static/js/190.1c9e3d39.chunk.js +2 -0
- package/web/static/js/{190.c864d902.chunk.js.map → 190.1c9e3d39.chunk.js.map} +1 -1
- package/web/static/js/1949.9086db0d.chunk.js +2 -0
- package/web/static/js/{1949.6ebed61b.chunk.js.map → 1949.9086db0d.chunk.js.map} +1 -1
- package/web/static/js/{2076.0ffaa5d4.chunk.js → 2076.6af39328.chunk.js} +2 -2
- package/web/static/js/{2076.0ffaa5d4.chunk.js.map → 2076.6af39328.chunk.js.map} +1 -1
- package/web/static/js/{2081.8362d59b.chunk.js → 2081.b3dc6876.chunk.js} +2 -2
- package/web/static/js/{2081.8362d59b.chunk.js.map → 2081.b3dc6876.chunk.js.map} +1 -1
- package/web/static/js/2134.b69f2059.chunk.js +2 -0
- package/web/static/js/{2134.e0ba4996.chunk.js.map → 2134.b69f2059.chunk.js.map} +1 -1
- package/web/static/js/2144.9a68ca25.chunk.js +2 -0
- package/web/static/js/{2144.42edbee6.chunk.js.map → 2144.9a68ca25.chunk.js.map} +1 -1
- package/web/static/js/{2191.c95ae2cd.chunk.js → 2191.331e9601.chunk.js} +2 -2
- package/web/static/js/{2191.c95ae2cd.chunk.js.map → 2191.331e9601.chunk.js.map} +1 -1
- package/web/static/js/2204.abb6769f.chunk.js +2 -0
- package/web/static/js/{2204.ff7bfaf1.chunk.js.map → 2204.abb6769f.chunk.js.map} +1 -1
- package/web/static/js/2206.d8dc74ee.chunk.js +2 -0
- package/web/static/js/{2206.c3122497.chunk.js.map → 2206.d8dc74ee.chunk.js.map} +1 -1
- package/web/static/js/2287.476f733f.chunk.js +2 -0
- package/web/static/js/{2287.d38944f1.chunk.js.map → 2287.476f733f.chunk.js.map} +1 -1
- package/web/static/js/{2302.507bc5f4.chunk.js → 2302.2c2b1710.chunk.js} +2 -2
- package/web/static/js/{2302.507bc5f4.chunk.js.map → 2302.2c2b1710.chunk.js.map} +1 -1
- package/web/static/js/{2326.05a269ae.chunk.js → 2326.2933f881.chunk.js} +2 -2
- package/web/static/js/{2326.05a269ae.chunk.js.map → 2326.2933f881.chunk.js.map} +1 -1
- package/web/static/js/{2633.54fe1930.chunk.js → 2633.353a08b1.chunk.js} +2 -2
- package/web/static/js/{2633.54fe1930.chunk.js.map → 2633.353a08b1.chunk.js.map} +1 -1
- package/web/static/js/2637.f7b026ce.chunk.js +2 -0
- package/web/static/js/{2637.d996c040.chunk.js.map → 2637.f7b026ce.chunk.js.map} +1 -1
- package/web/static/js/2730.16c5b784.chunk.js +2 -0
- package/web/static/js/{2730.64fb1f45.chunk.js.map → 2730.16c5b784.chunk.js.map} +1 -1
- package/web/static/js/2810.b88f0470.chunk.js +2 -0
- package/web/static/js/{2810.5d785d11.chunk.js.map → 2810.b88f0470.chunk.js.map} +1 -1
- package/web/static/js/{2860.283e99a3.chunk.js → 2860.1c24371b.chunk.js} +2 -2
- package/web/static/js/{2860.283e99a3.chunk.js.map → 2860.1c24371b.chunk.js.map} +1 -1
- package/web/static/js/{2869.71b339c3.chunk.js → 2869.fff04f77.chunk.js} +2 -2
- package/web/static/js/{2869.71b339c3.chunk.js.map → 2869.fff04f77.chunk.js.map} +1 -1
- package/web/static/js/3055.d866e965.chunk.js +2 -0
- package/web/static/js/{3055.cf175e33.chunk.js.map → 3055.d866e965.chunk.js.map} +1 -1
- package/web/static/js/{3177.ab91b49c.chunk.js → 3061.aca28e38.chunk.js} +2 -2
- package/web/static/js/{3061.6d1dbcc7.chunk.js.map → 3061.aca28e38.chunk.js.map} +1 -1
- package/web/static/js/{3109.be1ae97a.chunk.js → 3109.bf6ccfd9.chunk.js} +2 -2
- package/web/static/js/{3109.be1ae97a.chunk.js.map → 3109.bf6ccfd9.chunk.js.map} +1 -1
- package/web/static/js/{3161.88906b29.chunk.js → 3161.5712b0fc.chunk.js} +2 -2
- package/web/static/js/{3161.88906b29.chunk.js.map → 3161.5712b0fc.chunk.js.map} +1 -1
- package/web/static/js/{3061.6d1dbcc7.chunk.js → 3177.ee3049dc.chunk.js} +2 -2
- package/web/static/js/{3177.ab91b49c.chunk.js.map → 3177.ee3049dc.chunk.js.map} +1 -1
- package/web/static/js/3231.67e3bfa0.chunk.js +2 -0
- package/web/static/js/{3231.86e5a9af.chunk.js.map → 3231.67e3bfa0.chunk.js.map} +1 -1
- package/web/static/js/333.15a56f5e.chunk.js +2 -0
- package/web/static/js/{333.99eda08a.chunk.js.map → 333.15a56f5e.chunk.js.map} +1 -1
- package/web/static/js/335.90a3533c.chunk.js +2 -0
- package/web/static/js/{335.5fa7b0f6.chunk.js.map → 335.90a3533c.chunk.js.map} +1 -1
- package/web/static/js/3479.3e7bc277.chunk.js +2 -0
- package/web/static/js/{3479.07885d28.chunk.js.map → 3479.3e7bc277.chunk.js.map} +1 -1
- package/web/static/js/{3508.69e01ca9.chunk.js → 3508.33638225.chunk.js} +2 -2
- package/web/static/js/{3508.69e01ca9.chunk.js.map → 3508.33638225.chunk.js.map} +1 -1
- package/web/static/js/3535.6de0f923.chunk.js +2 -0
- package/web/static/js/{3535.99969a8e.chunk.js.map → 3535.6de0f923.chunk.js.map} +1 -1
- package/web/static/js/3552.9725e114.chunk.js +2 -0
- package/web/static/js/{3552.37e9b391.chunk.js.map → 3552.9725e114.chunk.js.map} +1 -1
- package/web/static/js/{3612.90208928.chunk.js → 3612.15b206eb.chunk.js} +2 -2
- package/web/static/js/{3612.90208928.chunk.js.map → 3612.15b206eb.chunk.js.map} +1 -1
- package/web/static/js/3717.3f1268b5.chunk.js +2 -0
- package/web/static/js/{3717.e32ec8d1.chunk.js.map → 3717.3f1268b5.chunk.js.map} +1 -1
- package/web/static/js/{3720.4257d6dc.chunk.js → 3720.3a2d5659.chunk.js} +2 -2
- package/web/static/js/{3720.4257d6dc.chunk.js.map → 3720.3a2d5659.chunk.js.map} +1 -1
- package/web/static/js/{9375.70bc0340.chunk.js → 3896.292878fe.chunk.js} +2 -2
- package/web/static/js/{3896.833cd43a.chunk.js.map → 3896.292878fe.chunk.js.map} +1 -1
- package/web/static/js/{3906.0b01eed3.chunk.js → 3906.fb61888e.chunk.js} +2 -2
- package/web/static/js/{3906.0b01eed3.chunk.js.map → 3906.fb61888e.chunk.js.map} +1 -1
- package/web/static/js/3914.64850d3a.chunk.js +2 -0
- package/web/static/js/{3914.e9637bc5.chunk.js.map → 3914.64850d3a.chunk.js.map} +1 -1
- package/web/static/js/{3984.50c9938a.chunk.js → 3984.a9819d09.chunk.js} +2 -2
- package/web/static/js/{3984.50c9938a.chunk.js.map → 3984.a9819d09.chunk.js.map} +1 -1
- package/web/static/js/4061.d1ed6129.chunk.js +2 -0
- package/web/static/js/{4061.d5d721a1.chunk.js.map → 4061.d1ed6129.chunk.js.map} +1 -1
- package/web/static/js/4070.d29dda6e.chunk.js +2 -0
- package/web/static/js/{4070.0ace6541.chunk.js.map → 4070.d29dda6e.chunk.js.map} +1 -1
- package/web/static/js/{4093.5b1ede70.chunk.js → 4093.4b67d1c7.chunk.js} +2 -2
- package/web/static/js/{4093.5b1ede70.chunk.js.map → 4093.4b67d1c7.chunk.js.map} +1 -1
- package/web/static/js/4107.eca5443b.chunk.js +2 -0
- package/web/static/js/{4107.d91e770f.chunk.js.map → 4107.eca5443b.chunk.js.map} +1 -1
- package/web/static/js/4137.b85e2de5.chunk.js +2 -0
- package/web/static/js/{4137.afdec2d8.chunk.js.map → 4137.b85e2de5.chunk.js.map} +1 -1
- package/web/static/js/4156.08e61372.chunk.js +2 -0
- package/web/static/js/{4156.65292e46.chunk.js.map → 4156.08e61372.chunk.js.map} +1 -1
- package/web/static/js/4307.c5789ff5.chunk.js +2 -0
- package/web/static/js/{4307.194c608d.chunk.js.map → 4307.c5789ff5.chunk.js.map} +1 -1
- package/web/static/js/{432.443115b8.chunk.js → 432.ad2801e4.chunk.js} +2 -2
- package/web/static/js/{432.443115b8.chunk.js.map → 432.ad2801e4.chunk.js.map} +1 -1
- package/web/static/js/4364.ef059cd5.chunk.js +2 -0
- package/web/static/js/{4364.5ede0267.chunk.js.map → 4364.ef059cd5.chunk.js.map} +1 -1
- package/web/static/js/4455.64c3d8df.chunk.js +2 -0
- package/web/static/js/{4455.c387fff7.chunk.js.map → 4455.64c3d8df.chunk.js.map} +1 -1
- package/web/static/js/{4477.e49d1233.chunk.js → 4477.58f937ba.chunk.js} +2 -2
- package/web/static/js/{4477.e49d1233.chunk.js.map → 4477.58f937ba.chunk.js.map} +1 -1
- package/web/static/js/{4529.f765f5f9.chunk.js → 4529.6f6a7980.chunk.js} +2 -2
- package/web/static/js/{4529.f765f5f9.chunk.js.map → 4529.6f6a7980.chunk.js.map} +1 -1
- package/web/static/js/{4575.e00c7e35.chunk.js → 4575.b84b63cd.chunk.js} +2 -2
- package/web/static/js/{4575.e00c7e35.chunk.js.map → 4575.b84b63cd.chunk.js.map} +1 -1
- package/web/static/js/{462.6aa933ce.chunk.js → 462.f248f6ea.chunk.js} +2 -2
- package/web/static/js/{462.6aa933ce.chunk.js.map → 462.f248f6ea.chunk.js.map} +1 -1
- package/web/static/js/{4725.cc165786.chunk.js → 4725.131542ea.chunk.js} +2 -2
- package/web/static/js/{4725.cc165786.chunk.js.map → 4725.131542ea.chunk.js.map} +1 -1
- package/web/static/js/{4861.760a5728.chunk.js → 4861.69669734.chunk.js} +2 -2
- package/web/static/js/{4861.760a5728.chunk.js.map → 4861.69669734.chunk.js.map} +1 -1
- package/web/static/js/498.536d1042.chunk.js +2 -0
- package/web/static/js/{498.e098e309.chunk.js.map → 498.536d1042.chunk.js.map} +1 -1
- package/web/static/js/530.ad2f61a1.chunk.js +2 -0
- package/web/static/js/{530.aed153af.chunk.js.map → 530.ad2f61a1.chunk.js.map} +1 -1
- package/web/static/js/{5388.265b6c41.chunk.js → 5388.f38bef53.chunk.js} +2 -2
- package/web/static/js/{5388.265b6c41.chunk.js.map → 5388.f38bef53.chunk.js.map} +1 -1
- package/web/static/js/5775.0c84a32f.chunk.js +2 -0
- package/web/static/js/{5775.ba04cebb.chunk.js.map → 5775.0c84a32f.chunk.js.map} +1 -1
- package/web/static/js/{5804.09a6221a.chunk.js → 5804.fd0480b2.chunk.js} +2 -2
- package/web/static/js/{5804.09a6221a.chunk.js.map → 5804.fd0480b2.chunk.js.map} +1 -1
- package/web/static/js/5852.a0dc3edb.chunk.js +2 -0
- package/web/static/js/{5852.81680c1d.chunk.js.map → 5852.a0dc3edb.chunk.js.map} +1 -1
- package/web/static/js/{5860.f20a549b.chunk.js → 5860.86c5cbe3.chunk.js} +2 -2
- package/web/static/js/{5860.f20a549b.chunk.js.map → 5860.86c5cbe3.chunk.js.map} +1 -1
- package/web/static/js/5900.7149b283.chunk.js +2 -0
- package/web/static/js/{5900.7e8b1c1c.chunk.js.map → 5900.7149b283.chunk.js.map} +1 -1
- package/web/static/js/597.d44c92d1.chunk.js +2 -0
- package/web/static/js/{597.33a99fc0.chunk.js.map → 597.d44c92d1.chunk.js.map} +1 -1
- package/web/static/js/6146.c78166ee.chunk.js +2 -0
- package/web/static/js/{6146.02595d77.chunk.js.map → 6146.c78166ee.chunk.js.map} +1 -1
- package/web/static/js/6255.77feee3a.chunk.js +2 -0
- package/web/static/js/{6255.ec81e9f0.chunk.js.map → 6255.77feee3a.chunk.js.map} +1 -1
- package/web/static/js/{6307.8621ad1f.chunk.js → 6307.ac2d0513.chunk.js} +2 -2
- package/web/static/js/{6307.8621ad1f.chunk.js.map → 6307.ac2d0513.chunk.js.map} +1 -1
- package/web/static/js/{636.2b02d702.chunk.js → 636.70fb3b12.chunk.js} +2 -2
- package/web/static/js/{636.2b02d702.chunk.js.map → 636.70fb3b12.chunk.js.map} +1 -1
- package/web/static/js/{649.8499b3f7.chunk.js → 649.7c92ca6c.chunk.js} +2 -2
- package/web/static/js/{649.8499b3f7.chunk.js.map → 649.7c92ca6c.chunk.js.map} +1 -1
- package/web/static/js/6503.9ec80e31.chunk.js +2 -0
- package/web/static/js/{6503.5f2349b1.chunk.js.map → 6503.9ec80e31.chunk.js.map} +1 -1
- package/web/static/js/{6512.40eb765d.chunk.js → 6512.700dbbe7.chunk.js} +2 -2
- package/web/static/js/{6512.40eb765d.chunk.js.map → 6512.700dbbe7.chunk.js.map} +1 -1
- package/web/static/js/6716.add4b992.chunk.js +2 -0
- package/web/static/js/6716.add4b992.chunk.js.map +1 -0
- package/web/static/js/6795.b4c430d9.chunk.js +2 -0
- package/web/static/js/{6795.bebf54d1.chunk.js.map → 6795.b4c430d9.chunk.js.map} +1 -1
- package/web/static/js/{6835.48c52b5a.chunk.js → 6835.85e5a6fe.chunk.js} +2 -2
- package/web/static/js/{6835.48c52b5a.chunk.js.map → 6835.85e5a6fe.chunk.js.map} +1 -1
- package/web/static/js/6889.0a68a9b1.chunk.js +2 -0
- package/web/static/js/{6889.9760ee32.chunk.js.map → 6889.0a68a9b1.chunk.js.map} +1 -1
- package/web/static/js/6890.53df5e4d.js +3 -0
- package/web/static/js/{4285.d22ed587.js.LICENSE.txt → 6890.53df5e4d.js.LICENSE.txt} +0 -0
- package/web/static/js/6890.53df5e4d.js.map +1 -0
- package/web/static/js/7019.9a6eaf3c.chunk.js +2 -0
- package/web/static/js/{7019.d2a9e0a0.chunk.js.map → 7019.9a6eaf3c.chunk.js.map} +1 -1
- package/web/static/js/7064.7cedd669.chunk.js +2 -0
- package/web/static/js/{7064.1feda4f5.chunk.js.map → 7064.7cedd669.chunk.js.map} +1 -1
- package/web/static/js/7096.276fd20d.chunk.js +2 -0
- package/web/static/js/{7096.7233b97b.chunk.js.map → 7096.276fd20d.chunk.js.map} +1 -1
- package/web/static/js/{7103.858f5648.chunk.js → 7103.daa1335b.chunk.js} +2 -2
- package/web/static/js/{7103.858f5648.chunk.js.map → 7103.daa1335b.chunk.js.map} +1 -1
- package/web/static/js/{713.bf164481.chunk.js → 713.b0c38175.chunk.js} +2 -2
- package/web/static/js/{713.bf164481.chunk.js.map → 713.b0c38175.chunk.js.map} +1 -1
- package/web/static/js/{7191.c0765c12.chunk.js → 7191.6bddc692.chunk.js} +2 -2
- package/web/static/js/{7191.c0765c12.chunk.js.map → 7191.6bddc692.chunk.js.map} +1 -1
- package/web/static/js/{7237.9107001a.chunk.js → 7237.a04bfb50.chunk.js} +2 -2
- package/web/static/js/{7237.9107001a.chunk.js.map → 7237.a04bfb50.chunk.js.map} +1 -1
- package/web/static/js/7342.24b0215c.chunk.js +2 -0
- package/web/static/js/{7342.f678a040.chunk.js.map → 7342.24b0215c.chunk.js.map} +1 -1
- package/web/static/js/{7499.917d3c0e.chunk.js → 7499.4eea90c9.chunk.js} +2 -2
- package/web/static/js/{7499.917d3c0e.chunk.js.map → 7499.4eea90c9.chunk.js.map} +1 -1
- package/web/static/js/7655.3bdc5151.chunk.js +2 -0
- package/web/static/js/{7655.67268587.chunk.js.map → 7655.3bdc5151.chunk.js.map} +1 -1
- package/web/static/js/7702.73da6d5e.chunk.js +2 -0
- package/web/static/js/{7702.d5a207ac.chunk.js.map → 7702.73da6d5e.chunk.js.map} +1 -1
- package/web/static/js/{7741.49dfa742.chunk.js → 7741.8e6a3a1d.chunk.js} +2 -2
- package/web/static/js/{7741.49dfa742.chunk.js.map → 7741.8e6a3a1d.chunk.js.map} +1 -1
- package/web/static/js/8047.afb8bd70.chunk.js +2 -0
- package/web/static/js/{8047.ec73e9a8.chunk.js.map → 8047.afb8bd70.chunk.js.map} +1 -1
- package/web/static/js/8110.c108ec6f.chunk.js +2 -0
- package/web/static/js/{8110.c0ad97fe.chunk.js.map → 8110.c108ec6f.chunk.js.map} +1 -1
- package/web/static/js/{8133.84406c17.chunk.js → 8133.63b5922a.chunk.js} +2 -2
- package/web/static/js/{8133.84406c17.chunk.js.map → 8133.63b5922a.chunk.js.map} +1 -1
- package/web/static/js/{8240.fdd46dad.chunk.js → 8240.e064ea8d.chunk.js} +2 -2
- package/web/static/js/{8240.fdd46dad.chunk.js.map → 8240.e064ea8d.chunk.js.map} +1 -1
- package/web/static/js/{8310.f3a2179c.chunk.js → 8310.c63a3fd1.chunk.js} +2 -2
- package/web/static/js/{8310.f3a2179c.chunk.js.map → 8310.c63a3fd1.chunk.js.map} +1 -1
- package/web/static/js/{8322.a529c34f.chunk.js → 8322.42dd0467.chunk.js} +2 -2
- package/web/static/js/{8322.a529c34f.chunk.js.map → 8322.42dd0467.chunk.js.map} +1 -1
- package/web/static/js/{8400.9f7d8e28.chunk.js → 8400.28c8c761.chunk.js} +2 -2
- package/web/static/js/{8400.9f7d8e28.chunk.js.map → 8400.28c8c761.chunk.js.map} +1 -1
- package/web/static/js/8415.19d6a621.chunk.js +2 -0
- package/web/static/js/{8415.1da9a8c6.chunk.js.map → 8415.19d6a621.chunk.js.map} +1 -1
- package/web/static/js/{4061.d5d721a1.chunk.js → 8467.b2ee1169.chunk.js} +2 -2
- package/web/static/js/{8467.6980e0c4.chunk.js.map → 8467.b2ee1169.chunk.js.map} +1 -1
- package/web/static/js/{8543.2648a0f6.chunk.js → 8543.58f35298.chunk.js} +2 -2
- package/web/static/js/{8543.2648a0f6.chunk.js.map → 8543.58f35298.chunk.js.map} +1 -1
- package/web/static/js/8630.c51b80ca.chunk.js +2 -0
- package/web/static/js/{8630.c63c3957.chunk.js.map → 8630.c51b80ca.chunk.js.map} +1 -1
- package/web/static/js/8660.9bad582e.chunk.js +2 -0
- package/web/static/js/{8660.2ba0842f.chunk.js.map → 8660.9bad582e.chunk.js.map} +1 -1
- package/web/static/js/8763.4f414d87.chunk.js +2 -0
- package/web/static/js/{8763.a8c2f646.chunk.js.map → 8763.4f414d87.chunk.js.map} +1 -1
- package/web/static/js/8822.fe5dc0e1.chunk.js +2 -0
- package/web/static/js/8822.fe5dc0e1.chunk.js.map +1 -0
- package/web/static/js/9036.bc65ca88.chunk.js +2 -0
- package/web/static/js/{9036.3a2a53e8.chunk.js.map → 9036.bc65ca88.chunk.js.map} +1 -1
- package/web/static/js/{9041.5ab09c0e.chunk.js → 9041.29725e33.chunk.js} +2 -2
- package/web/static/js/{9041.5ab09c0e.chunk.js.map → 9041.29725e33.chunk.js.map} +1 -1
- package/web/static/js/9351.f0f13e4c.chunk.js +2 -0
- package/web/static/js/{9351.27b41270.chunk.js.map → 9351.f0f13e4c.chunk.js.map} +1 -1
- package/web/static/js/9375.a35e41ad.chunk.js +2 -0
- package/web/static/js/{9375.70bc0340.chunk.js.map → 9375.a35e41ad.chunk.js.map} +1 -1
- package/web/static/js/9609.af1fd322.chunk.js +2 -0
- package/web/static/js/{9609.e574c787.chunk.js.map → 9609.af1fd322.chunk.js.map} +1 -1
- package/web/static/js/9624.cc68281c.chunk.js +2 -0
- package/web/static/js/{9624.556c2a56.chunk.js.map → 9624.cc68281c.chunk.js.map} +1 -1
- package/web/static/js/9650.c068e1d5.chunk.js +2 -0
- package/web/static/js/{9650.7ec42e29.chunk.js.map → 9650.c068e1d5.chunk.js.map} +1 -1
- package/web/static/js/{9666.bad06541.chunk.js → 9666.da3228f7.chunk.js} +2 -2
- package/web/static/js/{9666.bad06541.chunk.js.map → 9666.da3228f7.chunk.js.map} +1 -1
- package/web/static/js/9699.5cf9381a.chunk.js +2 -0
- package/web/static/js/{9699.da72e58b.chunk.js.map → 9699.5cf9381a.chunk.js.map} +1 -1
- package/web/static/js/{9773.8446f515.chunk.js → 9773.6de37226.chunk.js} +2 -2
- package/web/static/js/{9773.8446f515.chunk.js.map → 9773.6de37226.chunk.js.map} +1 -1
- package/web/static/js/{9808.269aa10a.chunk.js → 9808.c4333db4.chunk.js} +2 -2
- package/web/static/js/{9808.269aa10a.chunk.js.map → 9808.c4333db4.chunk.js.map} +1 -1
- package/web/static/js/981.ac2be71f.chunk.js +2 -0
- package/web/static/js/{981.03f01463.chunk.js.map → 981.ac2be71f.chunk.js.map} +1 -1
- package/web/static/js/9875.72dfb142.chunk.js +2 -0
- package/web/static/js/{9875.f42566b4.chunk.js.map → 9875.72dfb142.chunk.js.map} +1 -1
- package/web/static/js/{9915.6ef9e74a.chunk.js → 9915.8e596a28.chunk.js} +2 -2
- package/web/static/js/{9915.6ef9e74a.chunk.js.map → 9915.8e596a28.chunk.js.map} +1 -1
- package/web/static/js/9947.52bdb436.chunk.js +2 -0
- package/web/static/js/{9947.8aff2fc4.chunk.js.map → 9947.52bdb436.chunk.js.map} +1 -1
- package/web/static/js/{9985.2e4b2c4c.chunk.js → 9985.863e7b6b.chunk.js} +2 -2
- package/web/static/js/{9985.2e4b2c4c.chunk.js.map → 9985.863e7b6b.chunk.js.map} +1 -1
- package/web/static/js/{9986.be88d01d.chunk.js → 9986.62f00e08.chunk.js} +2 -2
- package/web/static/js/{9986.be88d01d.chunk.js.map → 9986.62f00e08.chunk.js.map} +1 -1
- package/web/static/js/main.a3231e89.js +2 -0
- package/web/static/js/main.a3231e89.js.map +1 -0
- package/web/static/js/vendors-uiwjs.36a34bfd.js +3 -0
- package/web/static/js/{vendors-uiwjs.3091e433.js.LICENSE.txt → vendors-uiwjs.36a34bfd.js.LICENSE.txt} +0 -0
- package/web/static/js/{vendors-uiwjs.3091e433.js.map → vendors-uiwjs.36a34bfd.js.map} +1 -1
- package/web/static/css/main.7a17942f.css.map +0 -1
- package/web/static/js/1048.e1f07ee4.chunk.js +0 -2
- package/web/static/js/1067.c19e8202.chunk.js +0 -2
- package/web/static/js/1574.2b98b114.chunk.js +0 -2
- package/web/static/js/1661.f881ca84.chunk.js +0 -2
- package/web/static/js/1876.6cad539d.chunk.js +0 -2
- package/web/static/js/1892.dce494f3.chunk.js +0 -2
- package/web/static/js/190.c864d902.chunk.js +0 -2
- package/web/static/js/1949.6ebed61b.chunk.js +0 -2
- package/web/static/js/2134.e0ba4996.chunk.js +0 -2
- package/web/static/js/2144.42edbee6.chunk.js +0 -2
- package/web/static/js/2204.ff7bfaf1.chunk.js +0 -2
- package/web/static/js/2206.c3122497.chunk.js +0 -2
- package/web/static/js/2287.d38944f1.chunk.js +0 -2
- package/web/static/js/2637.d996c040.chunk.js +0 -2
- package/web/static/js/2730.64fb1f45.chunk.js +0 -2
- package/web/static/js/3055.cf175e33.chunk.js +0 -2
- package/web/static/js/3231.86e5a9af.chunk.js +0 -2
- package/web/static/js/333.99eda08a.chunk.js +0 -2
- package/web/static/js/335.5fa7b0f6.chunk.js +0 -2
- package/web/static/js/3479.07885d28.chunk.js +0 -2
- package/web/static/js/3535.99969a8e.chunk.js +0 -2
- package/web/static/js/3552.37e9b391.chunk.js +0 -2
- package/web/static/js/3717.e32ec8d1.chunk.js +0 -2
- package/web/static/js/3896.833cd43a.chunk.js +0 -2
- package/web/static/js/3914.e9637bc5.chunk.js +0 -2
- package/web/static/js/4070.0ace6541.chunk.js +0 -2
- package/web/static/js/4107.d91e770f.chunk.js +0 -2
- package/web/static/js/4137.afdec2d8.chunk.js +0 -2
- package/web/static/js/4156.65292e46.chunk.js +0 -2
- package/web/static/js/4285.d22ed587.js +0 -3
- package/web/static/js/4285.d22ed587.js.map +0 -1
- package/web/static/js/4307.194c608d.chunk.js +0 -2
- package/web/static/js/4364.5ede0267.chunk.js +0 -2
- package/web/static/js/4455.c387fff7.chunk.js +0 -2
- package/web/static/js/498.e098e309.chunk.js +0 -2
- package/web/static/js/530.aed153af.chunk.js +0 -2
- package/web/static/js/5775.ba04cebb.chunk.js +0 -2
- package/web/static/js/5852.81680c1d.chunk.js +0 -2
- package/web/static/js/5900.7e8b1c1c.chunk.js +0 -2
- package/web/static/js/597.33a99fc0.chunk.js +0 -2
- package/web/static/js/6146.02595d77.chunk.js +0 -2
- package/web/static/js/6255.ec81e9f0.chunk.js +0 -2
- package/web/static/js/6503.5f2349b1.chunk.js +0 -2
- package/web/static/js/6716.02298cc2.chunk.js +0 -2
- package/web/static/js/6716.02298cc2.chunk.js.map +0 -1
- package/web/static/js/6795.bebf54d1.chunk.js +0 -2
- package/web/static/js/6889.9760ee32.chunk.js +0 -2
- package/web/static/js/7019.d2a9e0a0.chunk.js +0 -2
- package/web/static/js/7064.1feda4f5.chunk.js +0 -2
- package/web/static/js/7096.7233b97b.chunk.js +0 -2
- package/web/static/js/7342.f678a040.chunk.js +0 -2
- package/web/static/js/7655.67268587.chunk.js +0 -2
- package/web/static/js/7702.d5a207ac.chunk.js +0 -2
- package/web/static/js/8047.ec73e9a8.chunk.js +0 -2
- package/web/static/js/8110.c0ad97fe.chunk.js +0 -2
- package/web/static/js/8415.1da9a8c6.chunk.js +0 -2
- package/web/static/js/8467.6980e0c4.chunk.js +0 -2
- package/web/static/js/8630.c63c3957.chunk.js +0 -2
- package/web/static/js/8660.2ba0842f.chunk.js +0 -2
- package/web/static/js/8763.a8c2f646.chunk.js +0 -2
- package/web/static/js/8822.ae88e086.chunk.js +0 -2
- package/web/static/js/8822.ae88e086.chunk.js.map +0 -1
- package/web/static/js/9036.3a2a53e8.chunk.js +0 -2
- package/web/static/js/9351.27b41270.chunk.js +0 -2
- package/web/static/js/9609.e574c787.chunk.js +0 -2
- package/web/static/js/9624.556c2a56.chunk.js +0 -2
- package/web/static/js/9650.7ec42e29.chunk.js +0 -2
- package/web/static/js/9699.da72e58b.chunk.js +0 -2
- package/web/static/js/981.03f01463.chunk.js +0 -2
- package/web/static/js/9875.f42566b4.chunk.js +0 -2
- package/web/static/js/9947.8aff2fc4.chunk.js +0 -2
- package/web/static/js/main.34cd18a1.js +0 -2
- package/web/static/js/main.34cd18a1.js.map +0 -1
- package/web/static/js/vendors-uiwjs.3091e433.js +0 -3
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[9699],{9699:function(e,n,t){t.r(n),n.default={components:{18:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{ellipsis:!0,title:function(e){var t=e.key;return n.default.createElement("span",null,"\u5b57\u6bb5: ",t)},key:"name"},{title:"\u5e74\u9f84",style:{color:"red"},key:"age"},{title:"\u5730\u5740",key:"info"},{title:"\u64cd\u4f5c",key:"edit",width:98,render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement(a.Button,{size:"small",type:"success"},"\u4fee\u6539"))}}],o=[{name:"\u9093\u7d2b\u68cb",age:"12",info:"\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002",edit:""},{name:"\u674e\u6613\u5cf0",age:"32",info:"1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba",edit:""},{name:"\u8303\u51b0\u51b0",age:"23",info:"1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b",edit:""},{name:"\u6768\u5e42",age:"34",info:"1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002",edit:""},{name:"Angelababy",age:"54",info:"1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002",edit:""},{name:"\u5510\u5ae3",age:"12",info:"1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed",edit:""},{name:"\u5434\u4ea6\u51e1",age:"4",info:"1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002",edit:""}];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{columns:r,data:o}))}}(),71:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{title:"\u59d3\u540d",style:{color:"red"},key:"name",children:[{title:"\u82f1\u6587\u540d\u5b57",width:100,key:"name_en"},{title:"\u4e2d\u6587\u540d\u5b57",key:"cnname",children:[{title:"\u59d3\u540d",style:{color:"red"},key:"firstname",children:[{title:"\u59d3",key:"name1",width:80},{title:"\u540d",key:"name2",width:80}]},{title:"\u62fc\u97f3",key:"lastname",children:[{title:"\u59d3",key:"pinyin1",width:80},{title:"\u540d",key:"pinyin2",width:80}]}]}]},{title:"\u5176\u5b83",key:"other",children:[{title:"\u751f\u65e5",key:"birthday",width:150},{title:"\u804c\u4e1a",key:"job",width:150}]},{title:"\u64cd\u4f5c",key:"edit",width:150,render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement("span",null,e," ",t," - ",o," - ",i))}}],o=[{name1:"\u9093",name2:"\u7d2b\u68cb",pinyin1:"deng",pinyin2:"ziqi",name_en:"G.E.M.",birthday:"1991\u5e748\u670816\u65e5",job:"\u5531\u4f5c\u6b4c\u624b\u3001\u4f5c\u66f2\u4eba",edit:""},{name1:"\u5468",name2:"\u6770\u4f26",pinyin1:"zhou",pinyin2:"jielun",name_en:"Jay Chou",birthday:"1979\u5e741\u670818\u65e5",job:"\u6b4c\u624b\u3001\u97f3\u4e50\u4eba",edit:""},{name1:"\u9093",name2:"\u7d2b\u68cb",pinyin1:"deng",pinyin2:"ziqi",name_en:"G.E.M.",birthday:"1991\u5e748\u670816\u65e5",job:"\u5531\u4f5c\u6b4c\u624b\u3001\u4f5c\u66f2\u4eba",edit:""},{name1:"\u5468",name2:"\u6770\u4f26",pinyin1:"zhou",pinyin2:"jielun",name_en:"Jay Chou",birthday:"1979\u5e741\u670818\u65e5",job:"\u6b4c\u624b\u3001\u97f3\u4e50\u4eba",edit:""}];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{bordered:!0,columns:r,data:o}))}}(),146:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{title:"\u59d3\u540d",key:"name"},{title:"\u5e74\u9f84",style:{color:"red"},key:"age",colSpan:2,render:function(e,n,t,a,r){var o={children:e,props:{}};return 0===a&&(o.props.rowSpan=2),1===a&&(o.props.rowSpan=0),o}},{title:"\u5730\u5740",key:"info",colSpan:0},{title:"\u64cd\u4f5c",key:"edit",width:98,render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement(a.Button,{size:"small",type:"success"},"\u4fee\u6539"))}}],o=[{name:"\u9093\u7d2b\u68cb",age:"12",info:"\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002",edit:""},{name:"\u674e\u6613\u5cf0",age:"12",info:"1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba",edit:""},{name:"\u8303\u51b0\u51b0",age:"23",info:"1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b",edit:""},{name:"\u6768\u5e42",age:"34",info:"1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002",edit:""}];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{bordered:!0,columns:r,data:o}))}}(),207:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{title:"\u59d3\u540d",style:{color:"red"},key:"name"},{title:"\u5e74\u9f84",key:"age"},{title:"\u5730\u5740",key:"info"},{title:"\u64cd\u4f5c",key:"edit",width:98,render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement(a.Button,{size:"small",type:"success"},"\u4fee\u6539"))}}],o=[{name:"\u9093\u7d2b\u68cb",age:"12",info:"\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002",edit:""},{name:"\u674e\u6613\u5cf0",age:"32",info:"1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba",edit:""},{name:"\u8303\u51b0\u51b0",age:"23",info:"1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b",edit:""},{name:"\u6768\u5e42",age:"34",info:"1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002",edit:""},{name:"Angelababy",age:"54",info:"1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002",edit:""},{name:"\u5510\u5ae3",age:"12",info:"1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed",edit:""},{name:"\u5434\u4ea6\u51e1",age:"4",info:"1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002",edit:""}];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{title:n.default.createElement("div",null,"\u8fd9\u91cc\u662f\u6807\u9898\uff0c\u6709\u8fb9\u6846\uff0c",n.default.createElement("b",null,"bordered=true")),footer:n.default.createElement("div",null,"\u8fd9\u91cc\u662f\u9875\u811a Footer\uff0c\u6709\u8fb9\u6846\uff0c",n.default.createElement("b",null,"bordered=true")),bordered:!0,columns:r,data:o}),n.default.createElement(a.Table,{title:"\u8fd9\u91cc\u662f\u6807\u9898\uff0c\u6ca1\u6709\u8fb9\u6846",footer:"\u8fd9\u91cc\u662f\u9875\u811a Footer\uff0c\u6ca1\u6709\u8fb9\u6846",columns:r,data:o}))}}(),265:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{title:"\u59d3\u540d",style:{color:"red"},key:"name"},{title:"\u5e74\u9f84",key:"age"},{title:"\u5730\u5740",key:"info"},{title:"\u64cd\u4f5c",key:"edit",width:98,render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement(a.Button,{size:"small",type:"success"},"\u4fee\u6539"))}}],o=[{name:"\u9093\u7d2b\u68cb",age:"12",info:"\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002",edit:""},{name:"\u674e\u6613\u5cf0",age:"32",info:"1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba",edit:""},{name:"\u8303\u51b0\u51b0",age:"23",info:"1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b",edit:""},{name:"\u6768\u5e42",age:"34",info:"1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002",edit:""},{name:"Angelababy",age:"54",info:"1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002",edit:""},{name:"\u5510\u5ae3",age:"12",info:"1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed",edit:""},{name:"\u5434\u4ea6\u51e1",age:"4",info:"1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002",edit:""}];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{title:"\u8868\u5185\u5bb9 tbody \u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03\u4e8b\u4ef6",onCell:function(e,n){var t=n.rowNum,r=n.colNum;console.log("--\x3e3",e),console.log("--\x3e4",t),console.log("--\x3e5",r),a.Notify.info({description:'\u4f60\u70b9\u51fb\u4e86"'.concat(e.name,'"\u3002')})},columns:r,data:o}),n.default.createElement(a.Table,{title:"\u8868\u5934\u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03\u4e8b\u4ef6",onCellHead:function(e,n,t){console.log("--\x3e3",e),console.log("--\x3e4",n),console.log("--\x3e5",t),a.Notify.info({description:'\u4f60\u70b9\u51fb\u4e86"'.concat(e.title,'"\u3002')})},onCell:function(e,n){var t=n.rowNum,r=n.colNum;console.log("--\x3e3",e),console.log("--\x3e4",t),console.log("--\x3e5",r),a.Notify.info({description:'\u4f60\u70b9\u51fb\u4e86"'.concat(e.name,'"\u3002')})},columns:r,data:o}))}}(),338:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{bordered:!0},n.default.createElement("thead",null,n.default.createElement("tr",null,n.default.createElement("th",null,"\u540d\u79f0"),n.default.createElement("th",null,"\u6570\u91cf"),n.default.createElement("th",null,"\u8be6\u60c5"),n.default.createElement("th",null,"\u4ef7\u683c"))),n.default.createElement("tbody",null,n.default.createElement("tr",null,n.default.createElement("td",null,"\u571f\u8c46"),n.default.createElement("td",null,"18"),n.default.createElement("td",null,"2009/01/12"),n.default.createElement("td",null,"\uffe586,000")),n.default.createElement("tr",null,n.default.createElement("td",null,"\u841d\u535c"),n.default.createElement("td",null,"18"),n.default.createElement("td",null,"2009/01/12"),n.default.createElement("td",null,"\uffe586,000")),n.default.createElement("tr",null,n.default.createElement("td",null,"\u9999\u8549"),n.default.createElement("td",null,"18"),n.default.createElement("td",null,"2009/01/12"),n.default.createElement("td",null,"\uffe586,000")),n.default.createElement("tr",null,n.default.createElement("td",null,"\u829d\u9ebb"),n.default.createElement("td",null,"18"),n.default.createElement("td",null,"2009/01/12"),n.default.createElement("td",null,"\uffe586,000")))),n.default.createElement(a.Table,null,n.default.createElement("caption",null,"\u6ca1\u6709\u8fb9\u6846"),n.default.createElement("thead",null,n.default.createElement("tr",null,n.default.createElement("th",null,"\u540d\u79f0"),n.default.createElement("th",null,"\u6570\u91cf"),n.default.createElement("th",null,"\u8be6\u60c5"),n.default.createElement("th",null,"\u4ef7\u683c"))),n.default.createElement("tbody",null,n.default.createElement("tr",null,n.default.createElement("td",null,"\u571f\u8c46"),n.default.createElement("td",null,"18"),n.default.createElement("td",null,"2009/01/12"),n.default.createElement("td",null,"\uffe586,000")),n.default.createElement("tr",null,n.default.createElement("td",null,"\u841d\u535c"),n.default.createElement("td",null,"18"),n.default.createElement("td",null,"2009/01/12"),n.default.createElement("td",null,"\uffe586,000")),n.default.createElement("tr",null,n.default.createElement("td",null,"\u9999\u8549"),n.default.createElement("td",null,"18"),n.default.createElement("td",null,"2009/01/12"),n.default.createElement("td",null,"\uffe586,000")),n.default.createElement("tr",null,n.default.createElement("td",null,"\u829d\u9ebb"),n.default.createElement("td",null,"18"),n.default.createElement("td",null,"2009/01/12"),n.default.createElement("td",null,"\uffe586,000")))))}}(),424:function(){function e(n){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e(n)}var n,a=(n=t(8133))&&n.__esModule?n:{default:n},r=t(968);function o(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);n&&(a=a.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,a)}return t}function i(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function l(e,n){if(t=e,!(null!=(a=n)&&"undefined"!==typeof Symbol&&a[Symbol.hasInstance]?a[Symbol.hasInstance](t):t instanceof a))throw new TypeError("Cannot call a class as a function");var t,a}function u(e,n){for(var t=0;t<n.length;t++){var a=n[t];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}function d(e,n){return d=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,n){return e.__proto__=n,e},d(e,n)}function c(e){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 Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var t,a=f(e);if(n){var r=f(this).constructor;t=Reflect.construct(a,arguments,r)}else t=a.apply(this,arguments);return s(this,t)}}function s(n,t){if(t&&("object"===e(t)||"function"===typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return m(n)}function m(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function f(e){return f=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},f(e)}var _=function(e){!function(e,n){if("function"!==typeof n&&null!==n)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(n&&n.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),n&&d(e,n)}(_,e);var n,t,s,f=c(_);function _(e){var n;return l(this,_),(n=f.call(this,e)).state={checked:[],loading:!1,dataSource:[{name:"\u9093\u7d2b\u68cb",age:"12",info:"\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002"},{name:"\u674e\u6613\u5cf0",age:"32",info:"1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba"},{name:"\u8303\u51b0\u51b0",age:"23",info:"1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b"},{name:"\u6768\u5e42",age:"34",info:"1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002"},{name:"Angelababy",age:"54",info:"1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002"},{name:"\u5510\u5ae3",age:"12",info:"1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed"},{name:"\u5434\u4ea6\u51e1",age:"4",info:"1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002"}],columns:[{title:function(e,t,o){var i=n.state.dataSource.length!==n.state.checked.length&&n.state.checked.length>0,l=n.state.dataSource.length===n.state.checked.length;return a.default.createElement(r.Checkbox,{checked:l,indeterminate:i,onClick:function(e){var t=n.state.dataSource.map((function(e,n){return n}));e.target.checked||(t=[]),n.setState({checked:t})}})},key:"checked",render:function(e,t,o,i,l){return a.default.createElement(r.Checkbox,{checked:o.checked,onClick:n.onClickCheckedItem.bind(m(n),i)})}},{title:"\u540d\u5b57",key:"name"},{title:"\u5e74\u9f84",key:"age"},{title:"\u5730\u5740",key:"info"}]},n}return n=_,t=[{key:"onClickCheckedItem",value:function(e,n){var t=this.state.checked;n.target.checked?(t.push(e),t=t.sort((function(e,n){return e-n}))):t.splice(t.indexOf(e),1),this.setState({checked:t})}},{key:"render",value:function(){var e=this,n=this.state.checked,t=this.state.dataSource.map((function(e,t){return function(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?o(Object(t),!0).forEach((function(n){i(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):o(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}({checked:n.indexOf(t)>-1},e)}));return a.default.createElement("div",null,a.default.createElement(r.Loader,{loading:this.state.loading,style:{display:"block"}},a.default.createElement(r.Table,{columns:this.state.columns,data:t,footer:a.default.createElement(r.Pagination,{current:2,pageSize:10,total:30,divider:!0,onChange:function(n,t,a){e.setState({loading:!0}),setTimeout((function(){var t=e.state.dataSource.map((function(e){return e.age=Number(e.age)+n,e}));e.setState({checked:[],dataSource:t,loading:!1})}),2e3)}})})))}}],t&&u(n.prototype,t),s&&u(n,s),Object.defineProperty(n,"prototype",{writable:!1}),_}(a.default.Component);return _}(),538:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{title:"Name",key:"name",render:function(e){return n.default.createElement("a",null,e)},width:150},{title:"Age",key:"age",width:80},{title:"Address",key:"address",ellipsis:!0,render:function(e){return n.default.createElement(a.Tooltip,{placement:"topLeft",content:e},e)}},{title:"Long Column Long Column Long Column",key:"address",ellipsis:!0,render:function(e){return n.default.createElement(a.Tooltip,{placement:"topLeft",content:e},e)}},{title:"Long Column Long Column",key:"address",ellipsis:!0,render:function(e){return n.default.createElement(a.Tooltip,{placement:"topLeft",content:e},e)}},{title:"Long Column",key:"address",ellipsis:!0,render:function(e){return n.default.createElement(a.Tooltip,{placement:"topLeft",content:e},e)}}],o=[{name:"\u9093\u7d2b\u68cb",age:"12",address:"\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002"},{name:"\u674e\u6613\u5cf0",age:"32",address:"1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba"},{name:"\u8303\u51b0\u51b0",age:"23",address:"1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b"},{name:"\u6768\u5e42",age:"34",address:"1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002"},{name:"Angelababy",age:"54",address:"1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002"},{name:"\u5510\u5ae3",age:"12",address:"1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed"},{name:"\u5434\u4ea6\u51e1",age:"4",address:"1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002"}];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{title:"\u8868\u5185\u5bb9 tbody \u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03\u4e8b\u4ef6",columns:r,data:o}))}}(),622:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{ellipsis:!0,title:"\u59d3\u540d",key:"name"},{title:"\u5e74\u9f84",key:"age"},{title:"\u5730\u5740",key:"info"},{title:"\u64cd\u4f5c",key:"edit",width:98,render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement(a.Button,{size:"small",type:"success"},"\u4fee\u6539"))}}],o=[];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{columns:r,data:o,empty:n.default.createElement(a.Empty,null)}))}}(),664:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{title:"\u59d3\u540d",ellipsis:!0,key:"name"},{title:"\u5e74\u9f84",style:{color:"red"},key:"age"},{title:"\u64cd\u4f5c",key:"edit",width:98,render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement(a.Button,{size:"small",type:"success"},"\u4fee\u6539"))}}],o=[{name:"\u9093\u7d2b\u68cb",age:"10",id:"1"},{name:"\u674e\u6613\u5cf0",age:"32",id:"2"},{name:"\u8303\u51b0\u51b0",age:"23",id:"3"}];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{rowKey:"id",expandable:{expandedRowRender:function(e,t,a){return n.default.createElement("div",null,e.name)},rowExpandable:function(e){return"\u674e\u6613\u5cf0"!==e.name},expandIcon:function(e){return e?n.default.createElement(a.Icon,{type:"minus-circle-o"}):n.default.createElement(a.Icon,{type:"plus-circle-o"})},defaultExpandedRowKeys:["1"]},columns:r,data:o}))}}(),723:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);function r(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){var t=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==t)return;var a,r,o=[],i=!0,l=!1;try{for(t=t.call(e);!(i=(a=t.next()).done)&&(o.push(a.value),!n||o.length!==n);i=!0);}catch(u){l=!0,r=u}finally{try{i||null==t.return||t.return()}finally{if(l)throw r}}return o}(e,n)||function(e,n){if(!e)return;if("string"===typeof e)return o(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);"Object"===t&&e.constructor&&(t=e.constructor.name);if("Map"===t||"Set"===t)return Array.from(e);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return o(e,n)}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function o(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,a=new Array(n);t<n;t++)a[t]=e[t];return a}var i=[{title:"\u59d3\u540d",ellipsis:!0,key:"name"},{title:"\u5e74\u9f84",style:{color:"red"},key:"age"},{title:"\u64cd\u4f5c",key:"edit",width:98,render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement(a.Button,{size:"small",type:"success"},"\u4fee\u6539"))}}],l=[{name:"\u9093\u7d2b\u68cb",age:"10",id:"1",children:[{name:"\u9093\u7d2b\u68cb-0-1",age:"10",id:"1-1",children:[{name:"\u9093\u7d2b\u68cb-0-1-1",age:"10",id:"1-1-1",children:[{name:"\u9093\u7d2b\u68cb-0-1-1-1",age:"10",id:"-0-1-1-1"},{name:"\u9093\u7d2b\u68cb-0-1-1-2",age:"10",id:"-0-1-1-2"},{name:"\u9093\u7d2b\u68cb-0-1-1-3",age:"10",id:"-0-1-1-3"}]},{name:"\u9093\u7d2b\u68cb-0-1-2",age:"10",id:"1-1-2"}]},{name:"\u9093\u7d2b\u68cb-0-2",age:"10",id:"1-1"},{name:"\u9093\u7d2b\u68cb-0-3",age:"10",id:"1-1"}]},{name:"\u674e\u6613\u5cf0",age:"32",id:"2"},{name:"\u8303\u51b0\u51b0",age:"23",id:"3",children:[{name:"\u8303\u51b0\u51b00-1",age:"23",id:"3-1"},{name:"\u8303\u51b0\u51b00-2",age:"23",id:"3-2"},{name:"\u8303\u51b0\u51b00-3",age:"23",id:"3-3"}]}];return function(){var e=r(n.default.useState([]),2);e[0],e[1];return n.default.createElement("div",null,n.default.createElement(a.Table,{rowKey:"id",columns:i,data:l}))}}(),806:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{ellipsis:!0,width:1e3,title:function(e){var t=e.key;return n.default.createElement("span",null,"\u5b57\u6bb5: ",t)},key:"name"},{title:"\u5e74\u9f84",style:{color:"red"},key:"age"},{title:"\u5730\u5740",key:"info"},{title:"\u64cd\u4f5c",key:"edit",width:98,render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement(a.Button,{size:"small",type:"success"},"\u4fee\u6539"))}}],o=[{name:"\u9093\u7d2b\u68cb",age:"12",info:"\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002",edit:""},{name:"\u674e\u6613\u5cf0",age:"32",info:"1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba",edit:""},{name:"\u8303\u51b0\u51b0",age:"23",info:"1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b",edit:""},{name:"\u6768\u5e42",age:"34",info:"1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002",edit:""},{name:"Angelababy",age:"54",info:"1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002",edit:""},{name:"\u5510\u5ae3",age:"12",info:"1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed",edit:""},{name:"\u5434\u4ea6\u51e1",age:"4",info:"1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002",edit:""}];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{scroll:{x:1800,y:100},footer:n.default.createElement("div",{style:{height:20}},"\u8fd9\u4e2a\u662ffooter"),columns:r,data:o}))}}(),867:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);var r=[{title:"\u59d3\u540d",ellipsis:!0,width:50,key:"name"},{title:"\u5e74\u9f84",width:50,style:{color:"red"},key:"age"},{title:"\u5730\u5740",width:50,key:"info"},{title:"\u64cd\u4f5c",key:"edit",width:98,fixed:"right",render:function(e,t,r,o,i){return n.default.createElement("div",null,n.default.createElement(a.Button,{size:"small",type:"danger"},"\u5220\u9664"),n.default.createElement(a.Button,{size:"small",type:"success"},"\u4fee\u6539"))}}],o=[{name:"\u9093\u7d2b\u68cb",age:"12",info:"\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002",edit:""},{name:"\u674e\u6613\u5cf0",age:"32",info:"1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba",edit:""},{name:"\u8303\u51b0\u51b0",age:"23",info:"1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b",edit:""},{name:"\u6768\u5e42",age:"34",info:"1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002",edit:""},{name:"Angelababy",age:"54",info:"1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002",edit:""},{name:"\u5510\u5ae3",age:"12",info:"1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed",edit:""},{name:"\u5434\u4ea6\u51e1",age:"4",info:"1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002",edit:""}];return function(){return n.default.createElement("div",null,n.default.createElement(a.Table,{scroll:{x:1200},bordered:!0,columns:r,data:o}))}}(),922:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968),r=["edit","value","type","onChange","component"];function o(){return o=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e},o.apply(this,arguments)}function i(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){var t=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==t)return;var a,r,o=[],i=!0,l=!1;try{for(t=t.call(e);!(i=(a=t.next()).done)&&(o.push(a.value),!n||o.length!==n);i=!0);}catch(u){l=!0,r=u}finally{try{i||null==t.return||t.return()}finally{if(l)throw r}}return o}(e,n)||function(e,n){if(!e)return;if("string"===typeof e)return l(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);"Object"===t&&e.constructor&&(t=e.constructor.name);if("Map"===t||"Set"===t)return Array.from(e);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return l(e,n)}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function l(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,a=new Array(n);t<n;t++)a[t]=e[t];return a}function u(e,n){if(null==e)return{};var t,a,r=function(e,n){if(null==e)return{};var t,a,r={},o=Object.keys(e);for(a=0;a<o.length;a++)t=o[a],n.indexOf(t)>=0||(r[t]=e[t]);return r}(e,n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(a=0;a<o.length;a++)t=o[a],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(r[t]=e[t])}return r}function d(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);n&&(a=a.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,a)}return t}function c(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?d(Object(t),!0).forEach((function(n){s(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):d(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function s(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var m=[{id:1,gender:"\u7537",name:"\u9093\u7d2b\u68cb",age:"12",info:"\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973"},{id:2,gender:"\u7537",name:"\u674e\u6613\u5cf0",age:"32",info:"1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba"},{id:3,gender:"\u7537",name:"\u8303\u51b0\u51b0",age:"23",info:"1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b"},{id:4,gender:"\u7537",name:"\u6768\u5e42",age:"34",info:"1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002"},{id:5,gender:"\u7537",name:"Angelababy",age:"54",info:"1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002"},{id:6,gender:"\u7537",name:"\u5510\u5ae3",age:"12",info:"1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed"},{id:7,gender:"\u7537",name:"\u5434\u4ea6\u51e1",age:"4",info:"1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002"}],f=function(e){var t=e.edit,l=e.value,d=e.type,c=e.onChange,s=e.component,m=u(e,r),f=i(n.default.useState(t),2),_=f[0],y=f[1],p=n.default.useRef();return n.default.useEffect((function(){_&&p.current.focus()}),[_]),_?"Select"===s?n.default.createElement(a.Select,{ref:p,defaultValue:l,onBlur:function(e){c(e.target.value),y(!1)}},n.default.createElement(a.Select.Option,{value:"\u7537"},"\u7537"),n.default.createElement(a.Select.Option,{value:"\u5973"},"\u5973")):n.default.createElement(a.Input,o({},m,{defaultValue:l,ref:p,type:d||"text",onBlur:function(e){c(e.target.value),y(!1)}})):n.default.createElement("div",{onClick:function(){y(!0)}},l)};return function(){var e,t=i(n.default.useState(m),2),r=t[0],o=t[1];return n.default.createElement("div",null,n.default.createElement(a.Table,{columns:(e=function(e,n){o(r.map((function(t){return t.id===n?e:t})))},[{title:"\u59d3\u540d",ellipsis:!0,key:"name",render:function(t,a,r){return n.default.createElement(f,{value:t,onChange:function(n){e(c(c({},r),{},{name:n}),r.id)}})}},{title:"\u6027\u522b",key:"gender",render:function(t,a,r){return n.default.createElement(f,{value:t,component:"Select",onChange:function(n){e(c(c({},r),{},{gender:n}),r.id)}})}},{title:"\u5e74\u9f84",key:"age",render:function(t,a,r){return n.default.createElement(f,{value:t,type:"number",onChange:function(n){e(c(c({},r),{},{age:n}),r.id)}})}},{title:"\u5730\u5740",key:"info",render:function(t,a,r){return n.default.createElement(f,{value:t,onChange:function(n){e(c(c({},r),{},{info:n}),r.id)}})}}]),data:r}))}}(),1039:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},a=t(968);function r(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){var t=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==t)return;var a,r,o=[],i=!0,l=!1;try{for(t=t.call(e);!(i=(a=t.next()).done)&&(o.push(a.value),!n||o.length!==n);i=!0);}catch(u){l=!0,r=u}finally{try{i||null==t.return||t.return()}finally{if(l)throw r}}return o}(e,n)||function(e,n){if(!e)return;if("string"===typeof e)return o(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);"Object"===t&&e.constructor&&(t=e.constructor.name);if("Map"===t||"Set"===t)return Array.from(e);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return o(e,n)}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function o(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,a=new Array(n);t<n;t++)a[t]=e[t];return a}var i=function(e,t,r){return[{title:"\u59d3\u540d",ellipsis:!0,key:"name",render:function(n,t,a){return a.id===e?r.name:n}},{title:"\u6027\u522b",key:"gender",render:function(n,t,a){return a.id===e?r.gender:n}},{title:"\u5e74\u9f84",key:"age",render:function(n,t,a){return a.id===e?r.age:n}},{key:"id",render:function(r,o,i){var l=r===e;return l?n.default.createElement(n.default.Fragment,null,n.default.createElement(a.Button,{type:"primary",htmlType:"submit"},"Save"),n.default.createElement(a.Button,{type:"danger",onClick:function(){return t({})}},"Cancel")):n.default.createElement(a.Button,{type:"primary",onClick:function(e){e.preventDefault(),t(i)},disabled:void 0!==e&&!l},"Edit")}}]},l=[{id:1,gender:"\u7537",name:"\u9093\u7d2b\u68cb",age:"12"},{id:2,gender:"\u7537",name:"\u674e\u6613\u5cf0",age:"32"},{id:3,gender:"\u7537",name:"\u8303\u51b0\u51b0",age:"23"},{id:4,gender:"\u7537",name:"\u6768\u5e42",age:"34"},{id:5,gender:"\u7537",name:"Angelababy",age:"54"},{id:6,gender:"\u7537",name:"\u5510\u5ae3",age:"12"},{id:7,gender:"\u7537",name:"\u5434\u4ea6\u51e1",age:"4"}];return function(){var e=r(n.default.useState(l),2),t=e[0],o=e[1],u=r(n.default.useState({}),2),d=u[0],c=u[1],s=r(n.default.useState(),2),m=s[0],f=s[1],_=n.default.useRef(),y=function(e){f(e.id),c(e),_.current.setFields(e)};return n.default.createElement(a.Form,{ref:_,onSubmit:function(e){var n=e.current;JSON.stringify(d)!==JSON.stringify(n)?(o(t.map((function(e){return e.id===n.id?n:e}))),f(void 0),a.Notify.success({title:"\u63d0\u4ea4\u6210\u529f\uff01",description:"\u6570\u636e\u5df2\u7ecf\u66f4\u65b0"})):a.Notify.error({title:"\u63d0\u4ea4\u5931\u8d25\uff01",description:"\u8868\u5355\u63d0\u4ea4\u5185\u5bb9\u5e76\u6ca1\u6709\u4fee\u6539\uff01"})},fields:{name:{children:n.default.createElement(a.Input,{placeholder:"\u8bf7\u8f93\u5165\u59d3\u540d"})},age:{children:n.default.createElement(a.Input,{placeholder:"\u8bf7\u8f93\u5165\u5e74\u9f84",type:"number"})},gender:{children:n.default.createElement(a.Select,null,n.default.createElement(a.Select.Option,{value:"\u7537"},"\u7537"),n.default.createElement(a.Select.Option,{value:"\u5973"},"\u5973"))}}},(function(e){var r=e.fields;return n.default.createElement(a.Table,{columns:i(m,y,r),data:t})}))}}()},data:{18:{name:18,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:"\"use strict\";\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _uiw = require(\"uiw\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nvar columns = [{\n // title: '\u59d3\u540d',\n ellipsis: true,\n title: function title(_ref) {\n var key = _ref.key;\n return /*#__PURE__*/_react[\"default\"].createElement(\"span\", null, \"\\u5B57\\u6BB5: \", key);\n },\n key: 'name'\n}, {\n title: '\u5e74\u9f84',\n style: {\n color: 'red'\n },\n key: 'age'\n}, {\n title: '\u5730\u5740',\n key: 'info'\n}, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"danger\"\n }, \"\\u5220\\u9664\"), /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"success\"\n }, \"\\u4FEE\\u6539\"));\n }\n}];\nvar dataSource = [{\n name: '\u9093\u7d2b\u68cb',\n age: '12',\n info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002',\n edit: ''\n}, {\n name: '\u674e\u6613\u5cf0',\n age: '32',\n info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba',\n edit: ''\n}, {\n name: '\u8303\u51b0\u51b0',\n age: '23',\n info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b',\n edit: ''\n}, {\n name: '\u6768\u5e42',\n age: '34',\n info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002',\n edit: ''\n}, {\n name: 'Angelababy',\n age: '54',\n info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002',\n edit: ''\n}, {\n name: '\u5510\u5ae3',\n age: '12',\n info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed',\n edit: ''\n}, {\n name: '\u5434\u4ea6\u51e1',\n age: '4',\n info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002',\n edit: ''\n}];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n columns: columns,\n data: dataSource\n }));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n // title: '\u59d3\u540d',\n ellipsis: true, \n title: ({ key }) => {\n return (\n <span>\u5b57\u6bb5: {key}</span>\n )\n },\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo"},71:{name:71,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:"\"use strict\";\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _uiw = require(\"uiw\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nvar columns = [{\n title: '\u59d3\u540d',\n style: {\n color: 'red'\n },\n key: 'name',\n children: [{\n title: '\u82f1\u6587\u540d\u5b57',\n width: 100,\n key: 'name_en'\n }, {\n title: '\u4e2d\u6587\u540d\u5b57',\n key: 'cnname',\n children: [{\n title: '\u59d3\u540d',\n style: {\n color: 'red'\n },\n key: 'firstname',\n children: [{\n title: '\u59d3',\n key: 'name1',\n width: 80\n }, {\n title: '\u540d',\n key: 'name2',\n width: 80\n }]\n }, {\n title: '\u62fc\u97f3',\n key: 'lastname',\n children: [{\n title: '\u59d3',\n key: 'pinyin1',\n width: 80\n }, {\n title: '\u540d',\n key: 'pinyin2',\n width: 80\n }]\n }]\n }]\n}, {\n title: '\u5176\u5b83',\n key: 'other',\n children: [{\n title: '\u751f\u65e5',\n key: 'birthday',\n width: 150\n }, {\n title: '\u804c\u4e1a',\n key: 'job',\n width: 150\n }]\n}, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 150,\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"danger\"\n }, \"\\u5220\\u9664\"), /*#__PURE__*/_react[\"default\"].createElement(\"span\", null, text, \" \", key, \" - \", rowNumber, \" - \", columnNumber));\n }\n}];\nvar dataSource = [{\n name1: '\u9093',\n name2: '\u7d2b\u68cb',\n pinyin1: 'deng',\n pinyin2: 'ziqi',\n name_en: 'G.E.M.',\n birthday: '1991\u5e748\u670816\u65e5',\n job: '\u5531\u4f5c\u6b4c\u624b\u3001\u4f5c\u66f2\u4eba',\n edit: ''\n}, {\n name1: '\u5468',\n name2: '\u6770\u4f26',\n pinyin1: 'zhou',\n pinyin2: 'jielun',\n name_en: 'Jay Chou',\n birthday: '1979\u5e741\u670818\u65e5',\n job: '\u6b4c\u624b\u3001\u97f3\u4e50\u4eba',\n edit: ''\n}, {\n name1: '\u9093',\n name2: '\u7d2b\u68cb',\n pinyin1: 'deng',\n pinyin2: 'ziqi',\n name_en: 'G.E.M.',\n birthday: '1991\u5e748\u670816\u65e5',\n job: '\u5531\u4f5c\u6b4c\u624b\u3001\u4f5c\u66f2\u4eba',\n edit: ''\n}, {\n name1: '\u5468',\n name2: '\u6770\u4f26',\n pinyin1: 'zhou',\n pinyin2: 'jielun',\n name_en: 'Jay Chou',\n birthday: '1979\u5e741\u670818\u65e5',\n job: '\u6b4c\u624b\u3001\u97f3\u4e50\u4eba',\n edit: ''\n}];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n bordered: true,\n columns: columns,\n data: dataSource\n }));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n style: { color: 'red' },\n key: 'name', \n children: [\n {\n title: '\u82f1\u6587\u540d\u5b57',\n width: 100,\n key: 'name_en',\n },\n {\n title: '\u4e2d\u6587\u540d\u5b57',\n key: 'cnname',\n children:[\n {\n title: '\u59d3\u540d',\n style: { color: 'red' },\n key: 'firstname',\n children:[\n { title: '\u59d3', key: 'name1', width: 80 },\n { title: '\u540d', key: 'name2', width: 80 },\n ]\n }, {\n title: '\u62fc\u97f3',\n key: 'lastname',\n children:[\n { title: '\u59d3', key: 'pinyin1', width: 80 },\n { title: '\u540d', key: 'pinyin2', width: 80 },\n ],\n },\n ],\n }, \n ]\n }, {\n title: '\u5176\u5b83',\n key: 'other',\n children:[\n { title: '\u751f\u65e5', key: 'birthday', width: 150 },\n { title: '\u804c\u4e1a', key: 'job', width: 150 },\n ],\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 150,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <span>{text} {key} - {rowNumber} - {columnNumber}</span>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name1: '\u9093', name2:'\u7d2b\u68cb', pinyin1: 'deng', pinyin2: 'ziqi', name_en: 'G.E.M.', birthday: '1991\u5e748\u670816\u65e5', job: '\u5531\u4f5c\u6b4c\u624b\u3001\u4f5c\u66f2\u4eba', edit:'' },\n { name1: '\u5468', name2:'\u6770\u4f26', pinyin1: 'zhou', pinyin2: 'jielun', name_en: 'Jay Chou', birthday: '1979\u5e741\u670818\u65e5', job: '\u6b4c\u624b\u3001\u97f3\u4e50\u4eba', edit:'' },\n { name1: '\u9093', name2:'\u7d2b\u68cb', pinyin1: 'deng', pinyin2: 'ziqi', name_en: 'G.E.M.', birthday: '1991\u5e748\u670816\u65e5', job: '\u5531\u4f5c\u6b4c\u624b\u3001\u4f5c\u66f2\u4eba', edit:'' },\n { name1: '\u5468', name2:'\u6770\u4f26', pinyin1: 'zhou', pinyin2: 'jielun', name_en: 'Jay Chou', birthday: '1979\u5e741\u670818\u65e5', job: '\u6b4c\u624b\u3001\u97f3\u4e50\u4eba', edit:'' },\n];\nconst Demo = () => (\n <div>\n <Table bordered columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo"},146:{name:146,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:"\"use strict\";\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _uiw = require(\"uiw\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nvar columns = [{\n title: '\u59d3\u540d',\n key: 'name'\n}, {\n title: '\u5e74\u9f84',\n style: {\n color: 'red'\n },\n key: 'age',\n colSpan: 2,\n render: function render(text, key, rowData, rowNum, colNum) {\n var obj = {\n children: text,\n props: {}\n };\n\n if (rowNum === 0) {\n obj.props.rowSpan = 2;\n }\n\n if (rowNum === 1) {\n obj.props.rowSpan = 0;\n }\n\n return obj;\n }\n}, {\n title: '\u5730\u5740',\n key: 'info',\n colSpan: 0\n}, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"danger\"\n }, \"\\u5220\\u9664\"), /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"success\"\n }, \"\\u4FEE\\u6539\"));\n }\n}];\nvar dataSource = [{\n name: '\u9093\u7d2b\u68cb',\n age: '12',\n info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002',\n edit: ''\n}, {\n name: '\u674e\u6613\u5cf0',\n age: '12',\n info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba',\n edit: ''\n}, {\n name: '\u8303\u51b0\u51b0',\n age: '23',\n info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b',\n edit: ''\n}, {\n name: '\u6768\u5e42',\n age: '34',\n info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002',\n edit: ''\n}];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n bordered: true,\n columns: columns,\n data: dataSource\n }));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n colSpan: 2,\n render: (text, key, rowData, rowNum, colNum) => {\n const obj = {\n children: text,\n props: {}\n }\n if (rowNum === 0) {\n obj.props.rowSpan = 2;\n }\n if (rowNum === 1) {\n obj.props.rowSpan = 0;\n }\n return obj;\n }\n }, {\n title: '\u5730\u5740',\n key: 'info',\n colSpan: 0,\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '12', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table bordered columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo"},207:{name:207,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:"\"use strict\";\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _uiw = require(\"uiw\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nvar columns = [{\n title: '\u59d3\u540d',\n style: {\n color: 'red'\n },\n key: 'name'\n}, {\n title: '\u5e74\u9f84',\n key: 'age'\n}, {\n title: '\u5730\u5740',\n key: 'info'\n}, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"danger\"\n }, \"\\u5220\\u9664\"), /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"success\"\n }, \"\\u4FEE\\u6539\"));\n }\n}];\nvar dataSource = [{\n name: '\u9093\u7d2b\u68cb',\n age: '12',\n info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002',\n edit: ''\n}, {\n name: '\u674e\u6613\u5cf0',\n age: '32',\n info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba',\n edit: ''\n}, {\n name: '\u8303\u51b0\u51b0',\n age: '23',\n info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b',\n edit: ''\n}, {\n name: '\u6768\u5e42',\n age: '34',\n info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002',\n edit: ''\n}, {\n name: 'Angelababy',\n age: '54',\n info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002',\n edit: ''\n}, {\n name: '\u5510\u5ae3',\n age: '12',\n info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed',\n edit: ''\n}, {\n name: '\u5434\u4ea6\u51e1',\n age: '4',\n info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002',\n edit: ''\n}];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n title: /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, \"\\u8FD9\\u91CC\\u662F\\u6807\\u9898\\uFF0C\\u6709\\u8FB9\\u6846\\uFF0C\", /*#__PURE__*/_react[\"default\"].createElement(\"b\", null, \"bordered=true\")),\n footer: /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, \"\\u8FD9\\u91CC\\u662F\\u9875\\u811A Footer\\uFF0C\\u6709\\u8FB9\\u6846\\uFF0C\", /*#__PURE__*/_react[\"default\"].createElement(\"b\", null, \"bordered=true\")),\n bordered: true,\n columns: columns,\n data: dataSource\n }), /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n title: \"\\u8FD9\\u91CC\\u662F\\u6807\\u9898\\uFF0C\\u6CA1\\u6709\\u8FB9\\u6846\",\n footer: \"\\u8FD9\\u91CC\\u662F\\u9875\\u811A Footer\\uFF0C\\u6CA1\\u6709\\u8FB9\\u6846\",\n columns: columns,\n data: dataSource\n }));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n style: { color: 'red' },\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table\n title={(\n <div>\n \u8fd9\u91cc\u662f\u6807\u9898\uff0c\u6709\u8fb9\u6846\uff0c<b>bordered=true</b>\n </div>\n )}\n footer={(\n <div>\n \u8fd9\u91cc\u662f\u9875\u811a Footer\uff0c\u6709\u8fb9\u6846\uff0c<b>bordered=true</b>\n </div>\n )}\n bordered columns={columns} data={dataSource} />\n <Table title=\"\u8fd9\u91cc\u662f\u6807\u9898\uff0c\u6ca1\u6709\u8fb9\u6846\" footer=\"\u8fd9\u91cc\u662f\u9875\u811a Footer\uff0c\u6ca1\u6709\u8fb9\u6846\" columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo"},265:{name:265,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:"\"use strict\";\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _uiw = require(\"uiw\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nvar columns = [{\n title: '\u59d3\u540d',\n style: {\n color: 'red'\n },\n key: 'name'\n}, {\n title: '\u5e74\u9f84',\n key: 'age'\n}, {\n title: '\u5730\u5740',\n key: 'info'\n}, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"danger\"\n }, \"\\u5220\\u9664\"), /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"success\"\n }, \"\\u4FEE\\u6539\"));\n }\n}];\nvar dataSource = [{\n name: '\u9093\u7d2b\u68cb',\n age: '12',\n info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002',\n edit: ''\n}, {\n name: '\u674e\u6613\u5cf0',\n age: '32',\n info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba',\n edit: ''\n}, {\n name: '\u8303\u51b0\u51b0',\n age: '23',\n info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b',\n edit: ''\n}, {\n name: '\u6768\u5e42',\n age: '34',\n info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002',\n edit: ''\n}, {\n name: 'Angelababy',\n age: '54',\n info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002',\n edit: ''\n}, {\n name: '\u5510\u5ae3',\n age: '12',\n info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed',\n edit: ''\n}, {\n name: '\u5434\u4ea6\u51e1',\n age: '4',\n info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002',\n edit: ''\n}];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n title: \"\\u8868\\u5185\\u5BB9 tbody \\u5355\\u5143\\u683C\\u70B9\\u51FB\\u56DE\\u8C03\\u4E8B\\u4EF6\",\n onCell: function onCell(rowData, _ref) {\n var rowNum = _ref.rowNum,\n colNum = _ref.colNum;\n console.log('--\x3e3', rowData);\n console.log('--\x3e4', rowNum);\n console.log('--\x3e5', colNum);\n\n _uiw.Notify.info({\n description: \"\\u4F60\\u70B9\\u51FB\\u4E86\\\"\".concat(rowData.name, \"\\\"\\u3002\")\n });\n },\n columns: columns,\n data: dataSource\n }), /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n title: \"\\u8868\\u5934\\u5355\\u5143\\u683C\\u70B9\\u51FB\\u56DE\\u8C03\\u4E8B\\u4EF6\",\n onCellHead: function onCellHead(rowData, rowNum, columnNumber) {\n console.log('--\x3e3', rowData);\n console.log('--\x3e4', rowNum);\n console.log('--\x3e5', columnNumber);\n\n _uiw.Notify.info({\n description: \"\\u4F60\\u70B9\\u51FB\\u4E86\\\"\".concat(rowData.title, \"\\\"\\u3002\")\n });\n },\n onCell: function onCell(rowData, _ref2) {\n var rowNum = _ref2.rowNum,\n colNum = _ref2.colNum;\n console.log('--\x3e3', rowData);\n console.log('--\x3e4', rowNum);\n console.log('--\x3e5', colNum);\n\n _uiw.Notify.info({\n description: \"\\u4F60\\u70B9\\u51FB\\u4E86\\\"\".concat(rowData.name, \"\\\"\\u3002\")\n });\n },\n columns: columns,\n data: dataSource\n }));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Table, Button, Notify } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n style: { color: 'red' },\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table\n title=\"\u8868\u5185\u5bb9 tbody \u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03\u4e8b\u4ef6\"\n onCell={(rowData, { rowNum, colNum }) => {\n console.log('--\x3e3', rowData);\n console.log('--\x3e4', rowNum);\n console.log('--\x3e5', colNum);\n Notify.info({ description: `\u4f60\u70b9\u51fb\u4e86\"${rowData.name}\"\u3002` });\n }}\n columns={columns}\n data={dataSource}\n />\n <Table\n title=\"\u8868\u5934\u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03\u4e8b\u4ef6\"\n onCellHead={(rowData, rowNum, columnNumber) => {\n console.log('--\x3e3', rowData);\n console.log('--\x3e4', rowNum);\n console.log('--\x3e5', columnNumber);\n Notify.info({ description: `\u4f60\u70b9\u51fb\u4e86\"${rowData.title}\"\u3002` });\n }}\n onCell={(rowData, { rowNum, colNum }) => {\n console.log('--\x3e3', rowData);\n console.log('--\x3e4', rowNum);\n console.log('--\x3e5', colNum);\n Notify.info({ description: `\u4f60\u70b9\u51fb\u4e86\"${rowData.name}\"\u3002` });\n }}\n columns={columns}\n data={dataSource}\n />\n </div>\n);\nexport default Demo"},338:{name:338,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Table, {\n bordered: true\n }, /*#__PURE__*/_react["default"].createElement("thead", null, /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("th", null, "\\u540D\\u79F0"), /*#__PURE__*/_react["default"].createElement("th", null, "\\u6570\\u91CF"), /*#__PURE__*/_react["default"].createElement("th", null, "\\u8BE6\\u60C5"), /*#__PURE__*/_react["default"].createElement("th", null, "\\u4EF7\\u683C"))), /*#__PURE__*/_react["default"].createElement("tbody", null, /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("td", null, "\\u571F\\u8C46"), /*#__PURE__*/_react["default"].createElement("td", null, "18"), /*#__PURE__*/_react["default"].createElement("td", null, "2009/01/12"), /*#__PURE__*/_react["default"].createElement("td", null, "\\uFFE586,000")), /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("td", null, "\\u841D\\u535C"), /*#__PURE__*/_react["default"].createElement("td", null, "18"), /*#__PURE__*/_react["default"].createElement("td", null, "2009/01/12"), /*#__PURE__*/_react["default"].createElement("td", null, "\\uFFE586,000")), /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("td", null, "\\u9999\\u8549"), /*#__PURE__*/_react["default"].createElement("td", null, "18"), /*#__PURE__*/_react["default"].createElement("td", null, "2009/01/12"), /*#__PURE__*/_react["default"].createElement("td", null, "\\uFFE586,000")), /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("td", null, "\\u829D\\u9EBB"), /*#__PURE__*/_react["default"].createElement("td", null, "18"), /*#__PURE__*/_react["default"].createElement("td", null, "2009/01/12"), /*#__PURE__*/_react["default"].createElement("td", null, "\\uFFE586,000")))), /*#__PURE__*/_react["default"].createElement(_uiw.Table, null, /*#__PURE__*/_react["default"].createElement("caption", null, "\\u6CA1\\u6709\\u8FB9\\u6846"), /*#__PURE__*/_react["default"].createElement("thead", null, /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("th", null, "\\u540D\\u79F0"), /*#__PURE__*/_react["default"].createElement("th", null, "\\u6570\\u91CF"), /*#__PURE__*/_react["default"].createElement("th", null, "\\u8BE6\\u60C5"), /*#__PURE__*/_react["default"].createElement("th", null, "\\u4EF7\\u683C"))), /*#__PURE__*/_react["default"].createElement("tbody", null, /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("td", null, "\\u571F\\u8C46"), /*#__PURE__*/_react["default"].createElement("td", null, "18"), /*#__PURE__*/_react["default"].createElement("td", null, "2009/01/12"), /*#__PURE__*/_react["default"].createElement("td", null, "\\uFFE586,000")), /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("td", null, "\\u841D\\u535C"), /*#__PURE__*/_react["default"].createElement("td", null, "18"), /*#__PURE__*/_react["default"].createElement("td", null, "2009/01/12"), /*#__PURE__*/_react["default"].createElement("td", null, "\\uFFE586,000")), /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("td", null, "\\u9999\\u8549"), /*#__PURE__*/_react["default"].createElement("td", null, "18"), /*#__PURE__*/_react["default"].createElement("td", null, "2009/01/12"), /*#__PURE__*/_react["default"].createElement("td", null, "\\uFFE586,000")), /*#__PURE__*/_react["default"].createElement("tr", null, /*#__PURE__*/_react["default"].createElement("td", null, "\\u829D\\u9EBB"), /*#__PURE__*/_react["default"].createElement("td", null, "18"), /*#__PURE__*/_react["default"].createElement("td", null, "2009/01/12"), /*#__PURE__*/_react["default"].createElement("td", null, "\\uFFE586,000")))));\n};\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst Demo = () => (\n <div>\n <Table bordered>\n <thead>\n <tr>\n <th>\u540d\u79f0</th>\n <th>\u6570\u91cf</th>\n <th>\u8be6\u60c5</th>\n <th>\u4ef7\u683c</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>\u571f\u8c46</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u841d\u535c</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u9999\u8549</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u829d\u9ebb</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n </tbody>\n </Table>\n <Table>\n <caption>\u6ca1\u6709\u8fb9\u6846</caption>\n <thead>\n <tr>\n <th>\u540d\u79f0</th>\n <th>\u6570\u91cf</th>\n <th>\u8be6\u60c5</th>\n <th>\u4ef7\u683c</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>\u571f\u8c46</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u841d\u535c</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u9999\u8549</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u829d\u9ebb</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n </tbody>\n </Table>\n </div>\n);\nexport default Demo"},424:{name:424,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nfunction _instanceof(left, right) { if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) { return !!right[Symbol.hasInstance](left); } else { return left instanceof right; } }\n\nfunction _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _classCallCheck(instance, Constructor) { if (!_instanceof(instance, Constructor)) { throw new TypeError("Cannot call a class as a function"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn\'t been initialised - super() hasn\'t been called"); } return self; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nvar Demo = /*#__PURE__*/function (_React$Component) {\n _inherits(Demo, _React$Component);\n\n var _super = _createSuper(Demo);\n\n function Demo(props) {\n var _this;\n\n _classCallCheck(this, Demo);\n\n _this = _super.call(this, props);\n _this.state = {\n // \u9009\u4e2d\u7684 key\n checked: [],\n loading: false,\n dataSource: [{\n name: \'\u9093\u7d2b\u68cb\',\n age: \'12\',\n info: \'\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002\'\n }, {\n name: \'\u674e\u6613\u5cf0\',\n age: \'32\',\n info: \'1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\'\n }, {\n name: \'\u8303\u51b0\u51b0\',\n age: \'23\',\n info: \'1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b\'\n }, {\n name: \'\u6768\u5e42\',\n age: \'34\',\n info: \'1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002\'\n }, {\n name: \'Angelababy\',\n age: \'54\',\n info: \'1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002\'\n }, {\n name: \'\u5510\u5ae3\',\n age: \'12\',\n info: \'1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed\'\n }, {\n name: \'\u5434\u4ea6\u51e1\',\n age: \'4\',\n info: \'1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002\'\n }],\n columns: [{\n title: function title(data, rowNum, colNum) {\n var indeterminate = _this.state.dataSource.length !== _this.state.checked.length && _this.state.checked.length > 0;\n var checked = _this.state.dataSource.length === _this.state.checked.length;\n return /*#__PURE__*/_react["default"].createElement(_uiw.Checkbox, {\n checked: checked,\n indeterminate: indeterminate,\n onClick: function onClick(evn) {\n var checked = _this.state.dataSource.map(function (item, idx) {\n return idx;\n });\n\n if (!evn.target.checked) {\n checked = [];\n }\n\n _this.setState({\n checked: checked\n });\n }\n });\n },\n key: \'checked\',\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react["default"].createElement(_uiw.Checkbox, {\n checked: rowData.checked,\n onClick: _this.onClickCheckedItem.bind(_assertThisInitialized(_this), rowNumber)\n });\n }\n }, {\n title: \'\u540d\u5b57\',\n key: \'name\'\n }, {\n title: \'\u5e74\u9f84\',\n key: \'age\'\n }, {\n title: \'\u5730\u5740\',\n key: \'info\'\n }]\n };\n return _this;\n }\n\n _createClass(Demo, [{\n key: "onClickCheckedItem",\n value: function onClickCheckedItem(rowNumber, env) {\n var checked = this.state.checked;\n var isChecked = env.target.checked;\n\n if (isChecked) {\n // \u6dfb\u52a0\u5230\u9009\u4e2d\u6570\u7ec4\u4e2d\n checked.push(rowNumber);\n checked = checked.sort(function (a, b) {\n return a - b;\n });\n } else {\n // \u5220\u9664\u9009\u4e2d\u9879\n checked.splice(checked.indexOf(rowNumber), 1);\n }\n\n this.setState({\n checked: checked\n });\n }\n }, {\n key: "render",\n value: function render() {\n var _this2 = this;\n\n var checked = this.state.checked;\n var dataSource = this.state.dataSource.map(function (item, idx) {\n var isChecked = checked.indexOf(idx) > -1;\n return _objectSpread({\n checked: isChecked\n }, item);\n });\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Loader, {\n loading: this.state.loading,\n style: {\n display: \'block\'\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Table, {\n columns: this.state.columns,\n data: dataSource,\n footer: /*#__PURE__*/_react["default"].createElement(_uiw.Pagination, {\n current: 2,\n pageSize: 10,\n total: 30,\n divider: true,\n onChange: function onChange(current, total, pageSize) {\n _this2.setState({\n loading: true\n });\n\n var timer = setTimeout(function () {\n // \u6a21\u62df\u53d8\u66f4\u6570\u636e\n var dataSource = _this2.state.dataSource.map(function (item) {\n item.age = Number(item.age) + current;\n return item;\n }); // \u7ffb\u9875 API \u83b7\u53d6\u6570\u636e\n\n\n _this2.setState({\n checked: [],\n dataSource: dataSource,\n loading: false\n });\n }, 2000);\n }\n })\n })));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Table, Button, Checkbox, Pagination, Loader } from 'uiw';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n // \u9009\u4e2d\u7684 key\n checked: [],\n loading: false,\n dataSource: [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002' },\n ],\n columns: [\n {\n title: (data, rowNum, colNum) => {\n const indeterminate = this.state.dataSource.length !== this.state.checked.length && this.state.checked.length > 0;\n const checked = this.state.dataSource.length === this.state.checked.length;\n return (\n <Checkbox\n checked={checked}\n indeterminate={indeterminate}\n onClick={(evn) => {\n let checked = this.state.dataSource.map((item, idx) => idx);\n if(!evn.target.checked) {\n checked = [];\n }\n this.setState({ checked });\n }}\n />\n );\n },\n key: 'checked',\n render: (text, key, rowData, rowNumber, columnNumber) => {\n return (\n <Checkbox checked={rowData.checked} onClick={this.onClickCheckedItem.bind(this, rowNumber)} />\n );\n }\n }, {\n title: '\u540d\u5b57',\n key: 'name',\n }, {\n title: '\u5e74\u9f84',\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n },\n ]\n }\n }\n onClickCheckedItem(rowNumber, env) {\n let { checked } = this.state;\n const isChecked = env.target.checked;\n if(isChecked) {\n // \u6dfb\u52a0\u5230\u9009\u4e2d\u6570\u7ec4\u4e2d\n checked.push(rowNumber)\n checked = checked.sort((a, b) => a - b);\n } else {\n // \u5220\u9664\u9009\u4e2d\u9879\n checked.splice(checked.indexOf(rowNumber), 1);\n }\n this.setState({ checked });\n }\n render() {\n const { checked } = this.state;\n const dataSource = this.state.dataSource.map((item, idx) => {\n const isChecked = checked.indexOf(idx) > -1;\n return { checked: isChecked, ...item };\n });\n return (\n <div>\n <Loader loading={this.state.loading} style={{ display: 'block' }}>\n <Table\n columns={this.state.columns}\n data={dataSource}\n footer={\n <Pagination\n current={2}\n pageSize={10}\n total={30}\n divider\n onChange={(current, total, pageSize) => {\n this.setState({ loading: true });\n const timer = setTimeout(() => {\n // \u6a21\u62df\u53d8\u66f4\u6570\u636e\n const dataSource = this.state.dataSource.map(item => {\n item.age = Number(item.age) + current;\n return item;\n });\n // \u7ffb\u9875 API \u83b7\u53d6\u6570\u636e\n this.setState({ checked: [], dataSource, loading: false });\n }, 2000);\n }}\n />\n }\n />\n </Loader>\n </div>\n );\n }\n}\nexport default Demo"},538:{name:538,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:"\"use strict\";\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _uiw = require(\"uiw\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nvar columns = [{\n title: 'Name',\n key: 'name',\n render: function render(text) {\n return /*#__PURE__*/_react[\"default\"].createElement(\"a\", null, text);\n },\n width: 150\n}, {\n title: 'Age',\n key: 'age',\n width: 80\n}, {\n title: 'Address',\n key: 'address',\n ellipsis: true,\n render: function render(address) {\n return /*#__PURE__*/_react[\"default\"].createElement(_uiw.Tooltip, {\n placement: \"topLeft\",\n content: address\n }, address);\n }\n}, {\n title: 'Long Column Long Column Long Column',\n key: 'address',\n ellipsis: true,\n render: function render(address) {\n return /*#__PURE__*/_react[\"default\"].createElement(_uiw.Tooltip, {\n placement: \"topLeft\",\n content: address\n }, address);\n }\n}, {\n title: 'Long Column Long Column',\n key: 'address',\n ellipsis: true,\n render: function render(address) {\n return /*#__PURE__*/_react[\"default\"].createElement(_uiw.Tooltip, {\n placement: \"topLeft\",\n content: address\n }, address);\n }\n}, {\n title: 'Long Column',\n key: 'address',\n ellipsis: true,\n render: function render(address) {\n return /*#__PURE__*/_react[\"default\"].createElement(_uiw.Tooltip, {\n placement: \"topLeft\",\n content: address\n }, address);\n }\n}];\nvar data = [{\n name: '\u9093\u7d2b\u68cb',\n age: '12',\n address: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002'\n}, {\n name: '\u674e\u6613\u5cf0',\n age: '32',\n address: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba'\n}, {\n name: '\u8303\u51b0\u51b0',\n age: '23',\n address: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b'\n}, {\n name: '\u6768\u5e42',\n age: '34',\n address: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002'\n}, {\n name: 'Angelababy',\n age: '54',\n address: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002'\n}, {\n name: '\u5510\u5ae3',\n age: '12',\n address: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed'\n}, {\n name: '\u5434\u4ea6\u51e1',\n age: '4',\n address: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002'\n}];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n title: \"\\u8868\\u5185\\u5BB9 tbody \\u5355\\u5143\\u683C\\u70B9\\u51FB\\u56DE\\u8C03\\u4E8B\\u4EF6\",\n columns: columns,\n data: data\n }));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Table, Button, Notify, Tooltip } from 'uiw';\n\nconst columns = [\n {\n title: 'Name',\n key: 'name',\n render: text => <a>{text}</a>,\n width: 150,\n },\n {\n title: 'Age',\n key: 'age',\n width: 80,\n },\n {\n title: 'Address',\n key: 'address',\n ellipsis: true,\n render: address => (\n <Tooltip placement=\"topLeft\" content={address}>\n {address}\n </Tooltip>\n ),\n },\n {\n title: 'Long Column Long Column Long Column',\n key: 'address',\n ellipsis: true,\n render: address => (\n <Tooltip placement=\"topLeft\" content={address}>\n {address}\n </Tooltip>\n ),\n },\n {\n title: 'Long Column Long Column',\n key: 'address',\n ellipsis: true,\n render: address => (\n <Tooltip placement=\"topLeft\" content={address}>\n {address}\n </Tooltip>\n ),\n },\n {\n title: 'Long Column',\n key: 'address',\n ellipsis: true,\n render: address => {\n return (\n <Tooltip placement=\"topLeft\" content={address}>\n {address}\n </Tooltip>\n )\n },\n },\n];\n\nconst data = [\n { name: '\u9093\u7d2b\u68cb', age: '12', address: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002' },\n { name: '\u674e\u6613\u5cf0', age: '32', address: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba' },\n { name: '\u8303\u51b0\u51b0', age: '23', address: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b' },\n { name: '\u6768\u5e42', age: '34', address: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002' },\n { name: 'Angelababy', age: '54', address: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002' },\n { name: '\u5510\u5ae3', age: '12', address: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed' },\n { name: '\u5434\u4ea6\u51e1', age: '4', address: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002' },\n];\n\nconst Demo = () => (\n <div>\n <Table\n title=\"\u8868\u5185\u5bb9 tbody \u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03\u4e8b\u4ef6\"\n columns={columns}\n data={data}\n />\n </div>\n);\nexport default Demo"},622:{name:622,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nvar columns = [{\n ellipsis: true,\n title: \'\u59d3\u540d\',\n key: \'name\'\n}, {\n title: \'\u5e74\u9f84\',\n key: \'age\'\n}, {\n title: \'\u5730\u5740\',\n key: \'info\'\n}, {\n title: \'\u64cd\u4f5c\',\n key: \'edit\',\n width: 98,\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Button, {\n size: "small",\n type: "danger"\n }, "\\u5220\\u9664"), /*#__PURE__*/_react["default"].createElement(_uiw.Button, {\n size: "small",\n type: "success"\n }, "\\u4FEE\\u6539"));\n }\n}];\nvar dataSource = [];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Table, {\n columns: columns,\n data: dataSource,\n empty: /*#__PURE__*/_react["default"].createElement(_uiw.Empty, null)\n }));\n};\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Table, Button, Empty } from 'uiw';\n\nconst columns = [\n {\n ellipsis: true, \n title: '\u59d3\u540d',\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [];\nconst Demo = () => (\n <div>\n <Table\n columns={columns}\n data={dataSource}\n empty={<Empty />} \n />\n </div>\n);\nexport default Demo"},664:{name:664,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nvar columns = [{\n title: \'\u59d3\u540d\',\n ellipsis: true,\n key: \'name\'\n}, {\n title: \'\u5e74\u9f84\',\n style: {\n color: \'red\'\n },\n key: \'age\'\n}, {\n title: \'\u64cd\u4f5c\',\n key: \'edit\',\n width: 98,\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Button, {\n size: "small",\n type: "danger"\n }, "\\u5220\\u9664"), /*#__PURE__*/_react["default"].createElement(_uiw.Button, {\n size: "small",\n type: "success"\n }, "\\u4FEE\\u6539"));\n }\n}];\nvar dataSource = [{\n name: \'\u9093\u7d2b\u68cb\',\n age: \'10\',\n id: \'1\'\n}, {\n name: \'\u674e\u6613\u5cf0\',\n age: \'32\',\n id: \'2\'\n}, {\n name: \'\u8303\u51b0\u51b0\',\n age: \'23\',\n id: \'3\'\n}];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Table, {\n rowKey: "id",\n expandable: {\n expandedRowRender: function expandedRowRender(record, index, expanded) {\n return /*#__PURE__*/_react["default"].createElement("div", null, record.name);\n },\n // defaultExpandAllRows: true,\n rowExpandable: function rowExpandable(r) {\n return r.name !== \'\u674e\u6613\u5cf0\';\n },\n expandIcon: function expandIcon(expanded) {\n return expanded ? /*#__PURE__*/_react["default"].createElement(_uiw.Icon, {\n type: "minus-circle-o"\n }) : /*#__PURE__*/_react["default"].createElement(_uiw.Icon, {\n type: "plus-circle-o"\n });\n },\n defaultExpandedRowKeys: ["1"]\n },\n columns: columns,\n data: dataSource\n }));\n};\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Table, Button, Icon } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n key: 'name', \n }, \n {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n }, \n {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '10', id: '1'},\n { name: '\u674e\u6613\u5cf0', age: '32', id: '2'},\n { name: '\u8303\u51b0\u51b0', age: '23', id: '3'},\n];\nconst Demo = () => (\n <div>\n <Table \n rowKey=\"id\"\n expandable={{\n expandedRowRender: (record, index, expanded)=>{\n return <div>{record.name}</div>\n },\n // defaultExpandAllRows: true,\n rowExpandable: (r)=>r.name!=='\u674e\u6613\u5cf0',\n expandIcon: (expanded) => expanded ? <Icon type=\"minus-circle-o\"/> : <Icon type=\"plus-circle-o\"/>,\n defaultExpandedRowKeys: [\"1\"]\n }}\n columns={columns} \n data={dataSource} \n />\n </div>\n);\nexport default Demo"},723:{name:723,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:"\"use strict\";\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _uiw = require(\"uiw\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nvar columns = [{\n title: '\u59d3\u540d',\n ellipsis: true,\n key: 'name'\n}, {\n title: '\u5e74\u9f84',\n style: {\n color: 'red'\n },\n key: 'age'\n}, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"danger\"\n }, \"\\u5220\\u9664\"), /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"success\"\n }, \"\\u4FEE\\u6539\"));\n }\n}];\nvar dataSource = [{\n name: '\u9093\u7d2b\u68cb',\n age: '10',\n id: '1',\n children: [{\n name: '\u9093\u7d2b\u68cb-0-1',\n age: '10',\n id: '1-1',\n children: [{\n name: '\u9093\u7d2b\u68cb-0-1-1',\n age: '10',\n id: '1-1-1',\n children: [{\n name: '\u9093\u7d2b\u68cb-0-1-1-1',\n age: '10',\n id: '-0-1-1-1'\n }, {\n name: '\u9093\u7d2b\u68cb-0-1-1-2',\n age: '10',\n id: '-0-1-1-2'\n }, {\n name: '\u9093\u7d2b\u68cb-0-1-1-3',\n age: '10',\n id: '-0-1-1-3'\n }]\n }, {\n name: '\u9093\u7d2b\u68cb-0-1-2',\n age: '10',\n id: '1-1-2'\n }]\n }, {\n name: '\u9093\u7d2b\u68cb-0-2',\n age: '10',\n id: '1-1'\n }, {\n name: '\u9093\u7d2b\u68cb-0-3',\n age: '10',\n id: '1-1'\n }]\n}, {\n name: '\u674e\u6613\u5cf0',\n age: '32',\n id: '2'\n}, {\n name: '\u8303\u51b0\u51b0',\n age: '23',\n id: '3',\n children: [{\n name: '\u8303\u51b0\u51b00-1',\n age: '23',\n id: '3-1'\n }, {\n name: '\u8303\u51b0\u51b00-2',\n age: '23',\n id: '3-2'\n }, {\n name: '\u8303\u51b0\u51b00-3',\n age: '23',\n id: '3-3'\n }]\n}];\n\nvar Demo = function Demo() {\n var _React$useState = _react[\"default\"].useState([]),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n expandedRowKeys = _React$useState2[0],\n setExpandedRowKeys = _React$useState2[1];\n\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n rowKey: \"id\",\n columns: columns,\n data: dataSource\n }));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Table, Button, Icon } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n key: 'name', \n }, \n {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n }, \n {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { \n name: '\u9093\u7d2b\u68cb', \n age: '10', \n id: '1', \n children: [\n {\n name: '\u9093\u7d2b\u68cb-0-1', \n age: '10', \n id: '1-1', \n children: [\n { \n name: '\u9093\u7d2b\u68cb-0-1-1', \n age: '10', \n id: '1-1-1',\n children: [\n {name: '\u9093\u7d2b\u68cb-0-1-1-1', age: '10', id: '-0-1-1-1'},\n {name: '\u9093\u7d2b\u68cb-0-1-1-2', age: '10', id: '-0-1-1-2'},\n {name: '\u9093\u7d2b\u68cb-0-1-1-3', age: '10', id: '-0-1-1-3'},\n ]\n },\n { name: '\u9093\u7d2b\u68cb-0-1-2', age: '10', id: '1-1-2',}\n ]\n },\n {name: '\u9093\u7d2b\u68cb-0-2', age: '10', id: '1-1'},\n {name: '\u9093\u7d2b\u68cb-0-3', age: '10', id: '1-1'},\n ]\n },\n { name: '\u674e\u6613\u5cf0', age: '32', id: '2',},\n { name: '\u8303\u51b0\u51b0', age: '23', id: '3', \n children: [\n {name: '\u8303\u51b0\u51b00-1', age: '23', id: '3-1'},\n {name: '\u8303\u51b0\u51b00-2', age: '23', id: '3-2'},\n {name: '\u8303\u51b0\u51b00-3', age: '23', id: '3-3'},\n ]\n },\n];\nconst Demo = () => {\n const [expandedRowKeys, setExpandedRowKeys] = React.useState([])\n return (\n <div>\n <Table \n rowKey=\"id\"\n columns={columns}\n data={dataSource}\n />\n </div>\n )\n};\nexport default Demo"},806:{name:806,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:"\"use strict\";\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _uiw = require(\"uiw\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nvar columns = [{\n // title: '\u59d3\u540d',\n ellipsis: true,\n width: 1000,\n title: function title(_ref) {\n var key = _ref.key;\n return /*#__PURE__*/_react[\"default\"].createElement(\"span\", null, \"\\u5B57\\u6BB5: \", key);\n },\n key: 'name'\n}, {\n title: '\u5e74\u9f84',\n style: {\n color: 'red'\n },\n key: 'age'\n}, {\n title: '\u5730\u5740',\n key: 'info'\n}, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"danger\"\n }, \"\\u5220\\u9664\"), /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"success\"\n }, \"\\u4FEE\\u6539\"));\n }\n}];\nvar dataSource = [{\n name: '\u9093\u7d2b\u68cb',\n age: '12',\n info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002',\n edit: ''\n}, {\n name: '\u674e\u6613\u5cf0',\n age: '32',\n info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba',\n edit: ''\n}, {\n name: '\u8303\u51b0\u51b0',\n age: '23',\n info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b',\n edit: ''\n}, {\n name: '\u6768\u5e42',\n age: '34',\n info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002',\n edit: ''\n}, {\n name: 'Angelababy',\n age: '54',\n info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002',\n edit: ''\n}, {\n name: '\u5510\u5ae3',\n age: '12',\n info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed',\n edit: ''\n}, {\n name: '\u5434\u4ea6\u51e1',\n age: '4',\n info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002',\n edit: ''\n}];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n scroll: {\n x: 1800,\n y: 100\n },\n footer: /*#__PURE__*/_react[\"default\"].createElement(\"div\", {\n style: {\n height: 20\n }\n }, \"\\u8FD9\\u4E2A\\u662Ffooter\"),\n columns: columns,\n data: dataSource\n }));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n // title: '\u59d3\u540d',\n ellipsis: true, \n width: 1000,\n title: ({ key }) => {\n return (\n <span>\u5b57\u6bb5: {key}</span>\n )\n },\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table \n scroll={{x: 1800, y: 100}}\n footer={<div style={{height: 20, }}>\u8fd9\u4e2a\u662ffooter</div>}\n columns={columns} data={dataSource} \n />\n </div>\n);\nexport default Demo"},867:{name:867,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:"\"use strict\";\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _uiw = require(\"uiw\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }\n\nvar columns = [{\n title: '\u59d3\u540d',\n ellipsis: true,\n // fixed: true,\n width: 50,\n key: 'name'\n}, {\n // fixed: true,\n title: '\u5e74\u9f84',\n width: 50,\n style: {\n color: 'red'\n },\n key: 'age'\n}, {\n title: '\u5730\u5740',\n width: 50,\n key: 'info'\n}, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n fixed: 'right',\n render: function render(text, key, rowData, rowNumber, columnNumber) {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"danger\"\n }, \"\\u5220\\u9664\"), /*#__PURE__*/_react[\"default\"].createElement(_uiw.Button, {\n size: \"small\",\n type: \"success\"\n }, \"\\u4FEE\\u6539\"));\n }\n}];\nvar dataSource = [{\n name: '\u9093\u7d2b\u68cb',\n age: '12',\n info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002',\n edit: ''\n}, {\n name: '\u674e\u6613\u5cf0',\n age: '32',\n info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba',\n edit: ''\n}, {\n name: '\u8303\u51b0\u51b0',\n age: '23',\n info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b',\n edit: ''\n}, {\n name: '\u6768\u5e42',\n age: '34',\n info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002',\n edit: ''\n}, {\n name: 'Angelababy',\n age: '54',\n info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002',\n edit: ''\n}, {\n name: '\u5510\u5ae3',\n age: '12',\n info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed',\n edit: ''\n}, {\n name: '\u5434\u4ea6\u51e1',\n age: '4',\n info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002',\n edit: ''\n}];\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react[\"default\"].createElement(\"div\", null, /*#__PURE__*/_react[\"default\"].createElement(_uiw.Table, {\n scroll: {\n x: 1200\n },\n bordered: true,\n columns: columns,\n data: dataSource\n }));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n // fixed: true,\n width: 50,\n key: 'name', \n }, {\n // fixed: true,\n title: '\u5e74\u9f84',\n width: 50,\n style: { color: 'red' },\n key: 'age',\n }, {\n title: '\u5730\u5740',\n width: 50,\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n fixed: 'right',\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table scroll={{x: 1200}} bordered columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo"},922:{name:922,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nvar _excluded = ["edit", "value", "type", "onChange", "component"];\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar columns = function columns(_onChange) {\n return [{\n title: \'\u59d3\u540d\',\n ellipsis: true,\n key: \'name\',\n render: function render(text, key, rowData) {\n return /*#__PURE__*/_react["default"].createElement(EditInput, {\n value: text,\n onChange: function onChange(value) {\n _onChange(_objectSpread(_objectSpread({}, rowData), {}, {\n name: value\n }), rowData.id);\n }\n });\n }\n }, {\n title: \'\u6027\u522b\',\n key: \'gender\',\n render: function render(text, key, rowData) {\n return /*#__PURE__*/_react["default"].createElement(EditInput, {\n value: text,\n component: "Select",\n onChange: function onChange(value) {\n _onChange(_objectSpread(_objectSpread({}, rowData), {}, {\n gender: value\n }), rowData.id);\n }\n });\n }\n }, {\n title: \'\u5e74\u9f84\',\n key: \'age\',\n render: function render(text, key, rowData) {\n return /*#__PURE__*/_react["default"].createElement(EditInput, {\n value: text,\n type: "number",\n onChange: function onChange(value) {\n _onChange(_objectSpread(_objectSpread({}, rowData), {}, {\n age: value\n }), rowData.id);\n }\n });\n }\n }, {\n title: \'\u5730\u5740\',\n key: \'info\',\n render: function render(text, key, rowData) {\n return /*#__PURE__*/_react["default"].createElement(EditInput, {\n value: text,\n onChange: function onChange(value) {\n _onChange(_objectSpread(_objectSpread({}, rowData), {}, {\n info: value\n }), rowData.id);\n }\n });\n }\n }];\n};\n\nvar dataSource = [{\n id: 1,\n gender: "\u7537",\n name: \'\u9093\u7d2b\u68cb\',\n age: \'12\',\n info: \'\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\'\n}, {\n id: 2,\n gender: "\u7537",\n name: \'\u674e\u6613\u5cf0\',\n age: \'32\',\n info: \'1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\'\n}, {\n id: 3,\n gender: "\u7537",\n name: \'\u8303\u51b0\u51b0\',\n age: \'23\',\n info: \'1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b\'\n}, {\n id: 4,\n gender: "\u7537",\n name: \'\u6768\u5e42\',\n age: \'34\',\n info: \'1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002\'\n}, {\n id: 5,\n gender: "\u7537",\n name: \'Angelababy\',\n age: \'54\',\n info: \'1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002\'\n}, {\n id: 6,\n gender: "\u7537",\n name: \'\u5510\u5ae3\',\n age: \'12\',\n info: \'1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed\'\n}, {\n id: 7,\n gender: "\u7537",\n name: \'\u5434\u4ea6\u51e1\',\n age: \'4\',\n info: \'1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002\'\n}];\n\nvar EditInput = function EditInput(_ref) {\n var edit = _ref.edit,\n value = _ref.value,\n type = _ref.type,\n onChange = _ref.onChange,\n component = _ref.component,\n other = _objectWithoutProperties(_ref, _excluded);\n\n var _React$useState = _react["default"].useState(edit),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n isEdit = _React$useState2[0],\n setIsEdit = _React$useState2[1];\n\n var inputRef = _react["default"].useRef();\n\n _react["default"].useEffect(function () {\n isEdit && inputRef.current.focus();\n }, [isEdit]);\n\n if (isEdit) {\n if (component === "Select") {\n return /*#__PURE__*/_react["default"].createElement(_uiw.Select, {\n ref: inputRef,\n defaultValue: value,\n onBlur: function onBlur(e) {\n onChange(e.target.value);\n setIsEdit(false);\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Select.Option, {\n value: "\\u7537"\n }, "\\u7537"), /*#__PURE__*/_react["default"].createElement(_uiw.Select.Option, {\n value: "\\u5973"\n }, "\\u5973"));\n }\n\n return /*#__PURE__*/_react["default"].createElement(_uiw.Input, _extends({}, other, {\n defaultValue: value,\n ref: inputRef,\n type: type || "text",\n onBlur: function onBlur(e) {\n onChange(e.target.value);\n setIsEdit(false);\n }\n }));\n }\n\n return /*#__PURE__*/_react["default"].createElement("div", {\n onClick: function onClick() {\n setIsEdit(true);\n }\n }, value);\n};\n\nvar Demo = function Demo() {\n var _React$useState3 = _react["default"].useState(dataSource),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n data = _React$useState4[0],\n setData = _React$useState4[1];\n\n var onChange = function onChange(value, id) {\n setData(data.map(function (it) {\n return it.id === id ? value : it;\n }));\n };\n\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Table, {\n columns: columns(onChange),\n data: data\n }));\n};\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Table, Button, Input, Select } from 'uiw';\n\nconst columns = (onChange) => [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n key: 'name', \n render: (text,key, rowData) => {\n return <EditInput \n value={text} \n onChange={(value)=>{\n onChange({...rowData, name: value}, rowData.id)\n }} \n />\n }\n }, \n {\n title: '\u6027\u522b',\n key: 'gender',\n render: (text,key, rowData) => {\n return <EditInput \n value={text} \n component=\"Select\"\n onChange={(value)=>{\n onChange({...rowData, gender: value}, rowData.id)\n }} \n />\n }\n },\n {\n title: '\u5e74\u9f84',\n key: 'age',\n render: (text,key, rowData) => {\n return <EditInput \n value={text} \n type=\"number\"\n onChange={(value)=>{\n onChange({...rowData, age: value}, rowData.id)\n }} \n />\n }\n }, \n {\n title: '\u5730\u5740',\n key: 'info',\n render: (text,key, rowData) => {\n return <EditInput \n value={text} \n onChange={(value)=>{\n onChange({...rowData, info: value}, rowData.id)\n }} \n />\n }\n }, \n];\nconst dataSource = [\n { id: 1, gender: \"\u7537\", name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973'},\n { id: 2, gender: \"\u7537\", name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', },\n { id: 3, gender: \"\u7537\", name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', },\n { id: 4, gender: \"\u7537\", name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002'},\n { id: 5, gender: \"\u7537\", name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', },\n { id: 6, gender: \"\u7537\", name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', },\n { id: 7, gender: \"\u7537\", name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', },\n];\nconst EditInput = ({edit, value, type, onChange, component, ...other}) => {\n const [isEdit, setIsEdit] = React.useState(edit);\n const inputRef = React.useRef();\n React.useEffect(()=>{\n isEdit && inputRef.current.focus()\n }, [isEdit])\n if(isEdit) {\n if(component === \"Select\") {\n return <Select \n ref={inputRef}\n defaultValue={value} \n onBlur={e=>{\n onChange(e.target.value)\n setIsEdit(false)\n }}\n >\n <Select.Option value=\"\u7537\">\u7537</Select.Option>\n <Select.Option value=\"\u5973\">\u5973</Select.Option>\n </Select>\n }\n return <Input \n {...other}\n defaultValue={value} \n ref={inputRef} \n type={type || \"text\"}\n onBlur={(e)=>{\n onChange(e.target.value)\n setIsEdit(false)\n }}\n />\n }\n return <div onClick={()=>{\n setIsEdit(true)\n }}>{value}</div>\n}\nconst Demo = () => {\n const [data, setData] = React.useState(dataSource)\n const onChange = (value, id) => {\n setData(data.map(it=>it.id === id ? value : it))\n }\n return <div>\n <Table columns={columns(onChange)} data={data} />\n </div>\n};\nexport default Demo"},1039:{name:1039,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nvar columns = function columns(actived, setChange, fields) {\n return [{\n title: \'\u59d3\u540d\',\n ellipsis: true,\n key: \'name\',\n render: function render(text, key, rowData) {\n if (rowData.id === actived) return fields.name;\n return text;\n }\n }, {\n title: \'\u6027\u522b\',\n key: \'gender\',\n render: function render(text, key, rowData) {\n if (rowData.id === actived) return fields.gender;\n return text;\n }\n }, {\n title: \'\u5e74\u9f84\',\n key: \'age\',\n render: function render(text, key, rowData) {\n if (rowData.id === actived) return fields.age;\n return text;\n }\n }, {\n key: \'id\',\n render: function render(id, key, rowData) {\n var flag = id === actived;\n\n if (flag) {\n return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_uiw.Button, {\n type: "primary",\n htmlType: "submit"\n }, "Save"), /*#__PURE__*/_react["default"].createElement(_uiw.Button, {\n type: "danger",\n onClick: function onClick() {\n return setChange({});\n }\n }, "Cancel"));\n }\n\n return /*#__PURE__*/_react["default"].createElement(_uiw.Button, {\n type: "primary",\n onClick: function onClick(e) {\n e.preventDefault();\n setChange(rowData);\n },\n disabled: actived !== undefined && !flag\n }, "Edit");\n }\n }];\n};\n\nvar dataSource = [{\n id: 1,\n gender: "\u7537",\n name: \'\u9093\u7d2b\u68cb\',\n age: \'12\'\n}, {\n id: 2,\n gender: "\u7537",\n name: \'\u674e\u6613\u5cf0\',\n age: \'32\'\n}, {\n id: 3,\n gender: "\u7537",\n name: \'\u8303\u51b0\u51b0\',\n age: \'23\'\n}, {\n id: 4,\n gender: "\u7537",\n name: \'\u6768\u5e42\',\n age: \'34\'\n}, {\n id: 5,\n gender: "\u7537",\n name: \'Angelababy\',\n age: \'54\'\n}, {\n id: 6,\n gender: "\u7537",\n name: \'\u5510\u5ae3\',\n age: \'12\'\n}, {\n id: 7,\n gender: "\u7537",\n name: \'\u5434\u4ea6\u51e1\',\n age: \'4\'\n}];\n\nvar Demo = function Demo() {\n var _React$useState = _react["default"].useState(dataSource),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n data = _React$useState2[0],\n setData = _React$useState2[1];\n\n var _React$useState3 = _react["default"].useState({}),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n itemRowData = _React$useState4[0],\n setItemRowData = _React$useState4[1];\n\n var _React$useState5 = _react["default"].useState(),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n id = _React$useState6[0],\n setId = _React$useState6[1];\n\n var form = _react["default"].useRef();\n\n var setChange = function setChange(rowData) {\n setId(rowData.id);\n setItemRowData(rowData);\n form.current.setFields(rowData);\n };\n\n return /*#__PURE__*/_react["default"].createElement(_uiw.Form, {\n ref: form,\n onSubmit: function onSubmit(_ref) {\n var current = _ref.current;\n\n if (JSON.stringify(itemRowData) === JSON.stringify(current)) {\n _uiw.Notify.error({\n title: \'\u63d0\u4ea4\u5931\u8d25\uff01\',\n description: "\\u8868\\u5355\\u63D0\\u4EA4\\u5185\\u5BB9\\u5E76\\u6CA1\\u6709\\u4FEE\\u6539\\uFF01"\n });\n\n return;\n }\n\n setData(data.map(function (it) {\n return it.id === current.id ? current : it;\n }));\n setId(undefined);\n\n _uiw.Notify.success({\n title: \'\u63d0\u4ea4\u6210\u529f\uff01\',\n description: \'\u6570\u636e\u5df2\u7ecf\u66f4\u65b0\'\n });\n },\n fields: {\n name: {\n children: /*#__PURE__*/_react["default"].createElement(_uiw.Input, {\n placeholder: "\\u8BF7\\u8F93\\u5165\\u59D3\\u540D"\n })\n },\n age: {\n children: /*#__PURE__*/_react["default"].createElement(_uiw.Input, {\n placeholder: "\\u8BF7\\u8F93\\u5165\\u5E74\\u9F84",\n type: "number"\n })\n },\n gender: {\n children: /*#__PURE__*/_react["default"].createElement(_uiw.Select, null, /*#__PURE__*/_react["default"].createElement(_uiw.Select.Option, {\n value: "\\u7537"\n }, "\\u7537"), /*#__PURE__*/_react["default"].createElement(_uiw.Select.Option, {\n value: "\\u5973"\n }, "\\u5973"))\n }\n }\n }, function (_ref2) {\n var fields = _ref2.fields;\n return /*#__PURE__*/_react["default"].createElement(_uiw.Table, {\n columns: columns(id, setChange, fields),\n data: data\n });\n });\n};\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Table, Button, Input, Select, Form, Notify } from 'uiw';\n\nconst columns = (actived, setChange, fields) => {\n return [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n key: 'name', \n render: (text,key, rowData) => {\n if(rowData.id === actived) return fields.name\n return text\n }\n }, \n {\n title: '\u6027\u522b',\n key: 'gender',\n render: (text,key, rowData) => {\n if(rowData.id === actived) return fields.gender\n return text\n }\n },\n {\n title: '\u5e74\u9f84',\n key: 'age',\n render: (text,key, rowData) => {\n if(rowData.id === actived) return fields.age\n return text\n }\n }, \n {\n key: 'id',\n render: (id, key, rowData)=>{\n const flag = id === actived\n if(flag){\n return <>\n <Button type=\"primary\" htmlType=\"submit\">Save</Button>\n <Button type=\"danger\" onClick={()=>setChange({})}>Cancel</Button>\n </>\n }\n return <Button \n type=\"primary\" \n onClick={(e)=>{\n e.preventDefault();\n setChange(rowData)\n }} \n disabled={actived !== undefined && !flag}\n >Edit</Button>\n }\n }\n ]\n};\nconst dataSource = [\n { id: 1, gender: \"\u7537\", name: '\u9093\u7d2b\u68cb', age: '12', },\n { id: 2, gender: \"\u7537\", name: '\u674e\u6613\u5cf0', age: '32', },\n { id: 3, gender: \"\u7537\", name: '\u8303\u51b0\u51b0', age: '23', },\n { id: 4, gender: \"\u7537\", name: '\u6768\u5e42', age: '34',},\n { id: 5, gender: \"\u7537\", name: 'Angelababy', age: '54', },\n { id: 6, gender: \"\u7537\", name: '\u5510\u5ae3', age: '12', },\n { id: 7, gender: \"\u7537\", name: '\u5434\u4ea6\u51e1', age: '4', },\n];\nconst Demo = () => {\n const [data, setData] = React.useState(dataSource)\n const [itemRowData, setItemRowData] = React.useState({})\n const [id, setId] = React.useState()\n \n const form = React.useRef()\n const setChange = (rowData) => {\n setId(rowData.id)\n setItemRowData(rowData)\n form.current.setFields(rowData)\n }\n\n return <Form\n ref={form}\n onSubmit={({ current }) => {\n if(JSON.stringify(itemRowData) === JSON.stringify(current)) {\n Notify.error({\n title: '\u63d0\u4ea4\u5931\u8d25\uff01',\n description: `\u8868\u5355\u63d0\u4ea4\u5185\u5bb9\u5e76\u6ca1\u6709\u4fee\u6539\uff01`,\n });\n return \n }\n setData(data.map(it=>it.id === current.id ? current : it))\n setId(undefined)\n Notify.success({\n title: '\u63d0\u4ea4\u6210\u529f\uff01',\n description: '\u6570\u636e\u5df2\u7ecf\u66f4\u65b0'\n });\n }}\n fields={{\n name: {\n children: <Input placeholder=\"\u8bf7\u8f93\u5165\u59d3\u540d\" />\n },\n age: {\n children: <Input placeholder=\"\u8bf7\u8f93\u5165\u5e74\u9f84\" type=\"number\" />\n },\n gender: {\n children: <Select>\n <Select.Option value=\"\u7537\">\u7537</Select.Option>\n <Select.Option value=\"\u5973\">\u5973</Select.Option>\n </Select>\n }\n }}\n >\n {({ fields }) => <Table columns={columns(id, setChange, fields)} data={data} />}\n </Form>\n};\nexport default Demo"}},source:"Table \u8868\u683c\n===\n\n[](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-table/file/README.md)\n[](https://www.npmjs.com/package/@uiw/react-table)\n[](https://npmjs.com/@uiw/react-table)\n\n\u8868\u793a\u4e24\u79cd\u76f8\u4e92\u5bf9\u7acb\u7684\u72b6\u6001\u95f4\u7684\u5207\u6362\uff0c\u591a\u7528\u4e8e\u89e6\u53d1\u300c\u5f00/\u5173\u300d\u3002\u9009\u4e2d\u65f6\u7684\u5185\u5bb9\u652f\u6301\u54cd\u5e94\u5f0f\u3002\n\n```jsx\nimport { Table } from 'uiw';\n// or\nimport Table from '@uiw/react-table';\n```\n\n### \u57fa\u672c\u4f7f\u7528\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n // title: '\u59d3\u540d',\n ellipsis: true, \n title: ({ key }) => {\n return (\n <span>\u5b57\u6bb5: {key}</span>\n )\n },\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo\n```\n### \u8868\u5934\u5206\u7ec4\n\n\u8868\u5934\u5206\u7ec4\u901a\u8fc7 `columns` \u6570\u7ec4\u4e2d\u5bf9\u8c61\u7684 `children` \u6765\u5b9e\u73b0\uff0c\u4ee5\u6e32\u67d3\u5206\u7ec4\u8868\u5934\u3002\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n style: { color: 'red' },\n key: 'name', \n children: [\n {\n title: '\u82f1\u6587\u540d\u5b57',\n width: 100,\n key: 'name_en',\n },\n {\n title: '\u4e2d\u6587\u540d\u5b57',\n key: 'cnname',\n children:[\n {\n title: '\u59d3\u540d',\n style: { color: 'red' },\n key: 'firstname',\n children:[\n { title: '\u59d3', key: 'name1', width: 80 },\n { title: '\u540d', key: 'name2', width: 80 },\n ]\n }, {\n title: '\u62fc\u97f3',\n key: 'lastname',\n children:[\n { title: '\u59d3', key: 'pinyin1', width: 80 },\n { title: '\u540d', key: 'pinyin2', width: 80 },\n ],\n },\n ],\n }, \n ]\n }, {\n title: '\u5176\u5b83',\n key: 'other',\n children:[\n { title: '\u751f\u65e5', key: 'birthday', width: 150 },\n { title: '\u804c\u4e1a', key: 'job', width: 150 },\n ],\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 150,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <span>{text} {key} - {rowNumber} - {columnNumber}</span>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name1: '\u9093', name2:'\u7d2b\u68cb', pinyin1: 'deng', pinyin2: 'ziqi', name_en: 'G.E.M.', birthday: '1991\u5e748\u670816\u65e5', job: '\u5531\u4f5c\u6b4c\u624b\u3001\u4f5c\u66f2\u4eba', edit:'' },\n { name1: '\u5468', name2:'\u6770\u4f26', pinyin1: 'zhou', pinyin2: 'jielun', name_en: 'Jay Chou', birthday: '1979\u5e741\u670818\u65e5', job: '\u6b4c\u624b\u3001\u97f3\u4e50\u4eba', edit:'' },\n { name1: '\u9093', name2:'\u7d2b\u68cb', pinyin1: 'deng', pinyin2: 'ziqi', name_en: 'G.E.M.', birthday: '1991\u5e748\u670816\u65e5', job: '\u5531\u4f5c\u6b4c\u624b\u3001\u4f5c\u66f2\u4eba', edit:'' },\n { name1: '\u5468', name2:'\u6770\u4f26', pinyin1: 'zhou', pinyin2: 'jielun', name_en: 'Jay Chou', birthday: '1979\u5e741\u670818\u65e5', job: '\u6b4c\u624b\u3001\u97f3\u4e50\u4eba', edit:'' },\n];\nconst Demo = () => (\n <div>\n <Table bordered columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo\n```\n\n### \u8868\u683c\u884c/\u5217\u5408\u5e76\n\n\u8868\u5934\u53ea\u652f\u6301\u5217\u5408\u5e76\uff0c\u4f7f\u7528 `columns` \u91cc\u7684 `colSpan` \u8fdb\u884c\u8bbe\u7f6e\u3002\u8868\u683c\u652f\u6301\u884c/\u5217\u5408\u5e76\uff0c\u4f7f\u7528 `render` \u91cc\u7684\u5355\u5143\u683c\u5c5e\u6027 `colSpan` \u6216\u8005 `rowSpan` \u8bbe\u503c\u4e3a 0 \u65f6\uff0c\u8bbe\u7f6e\u7684\u8868\u683c\u4e0d\u4f1a\u6e32\u67d3\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n colSpan: 2,\n render: (text, key, rowData, rowNum, colNum) => {\n const obj = {\n children: text,\n props: {}\n }\n if (rowNum === 0) {\n obj.props.rowSpan = 2;\n }\n if (rowNum === 1) {\n obj.props.rowSpan = 0;\n }\n return obj;\n }\n }, {\n title: '\u5730\u5740',\n key: 'info',\n colSpan: 0,\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '12', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table bordered columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo\n```\n\n\n### \u6807\u9898\u9875\u811a\n\n\u6dfb\u52a0\u8868\u683c\u8fb9\u6846\u7ebf\uff0c\u9875\u5934\u548c\u9875\u811a\u7684\u5c55\u73b0\u6548\u679c\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n style: { color: 'red' },\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table\n title={(\n <div>\n \u8fd9\u91cc\u662f\u6807\u9898\uff0c\u6709\u8fb9\u6846\uff0c<b>bordered=true</b>\n </div>\n )}\n footer={(\n <div>\n \u8fd9\u91cc\u662f\u9875\u811a Footer\uff0c\u6709\u8fb9\u6846\uff0c<b>bordered=true</b>\n </div>\n )}\n bordered columns={columns} data={dataSource} />\n <Table title=\"\u8fd9\u91cc\u662f\u6807\u9898\uff0c\u6ca1\u6709\u8fb9\u6846\" footer=\"\u8fd9\u91cc\u662f\u9875\u811a Footer\uff0c\u6ca1\u6709\u8fb9\u6846\" columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo\n```\n\n### \u70b9\u51fb\u5355\u5143\u683c\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button, Notify } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n style: { color: 'red' },\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table\n title=\"\u8868\u5185\u5bb9 tbody \u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03\u4e8b\u4ef6\"\n onCell={(rowData, { rowNum, colNum }) => {\n console.log('--\x3e3', rowData);\n console.log('--\x3e4', rowNum);\n console.log('--\x3e5', colNum);\n Notify.info({ description: `\u4f60\u70b9\u51fb\u4e86\"${rowData.name}\"\u3002` });\n }}\n columns={columns}\n data={dataSource}\n />\n <Table\n title=\"\u8868\u5934\u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03\u4e8b\u4ef6\"\n onCellHead={(rowData, rowNum, columnNumber) => {\n console.log('--\x3e3', rowData);\n console.log('--\x3e4', rowNum);\n console.log('--\x3e5', columnNumber);\n Notify.info({ description: `\u4f60\u70b9\u51fb\u4e86\"${rowData.title}\"\u3002` });\n }}\n onCell={(rowData, { rowNum, colNum }) => {\n console.log('--\x3e3', rowData);\n console.log('--\x3e4', rowNum);\n console.log('--\x3e5', colNum);\n Notify.info({ description: `\u4f60\u70b9\u51fb\u4e86\"${rowData.name}\"\u3002` });\n }}\n columns={columns}\n data={dataSource}\n />\n </div>\n);\nexport default Demo\n```\n\n### \u539f\u59cbHTML\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst Demo = () => (\n <div>\n <Table bordered>\n <thead>\n <tr>\n <th>\u540d\u79f0</th>\n <th>\u6570\u91cf</th>\n <th>\u8be6\u60c5</th>\n <th>\u4ef7\u683c</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>\u571f\u8c46</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u841d\u535c</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u9999\u8549</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u829d\u9ebb</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n </tbody>\n </Table>\n <Table>\n <caption>\u6ca1\u6709\u8fb9\u6846</caption>\n <thead>\n <tr>\n <th>\u540d\u79f0</th>\n <th>\u6570\u91cf</th>\n <th>\u8be6\u60c5</th>\n <th>\u4ef7\u683c</th>\n </tr>\n </thead>\n <tbody>\n <tr>\n <td>\u571f\u8c46</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u841d\u535c</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u9999\u8549</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n <tr>\n <td>\u829d\u9ebb</td>\n <td>18</td>\n <td>2009/01/12</td>\n <td>\uffe586,000</td>\n </tr>\n </tbody>\n </Table>\n </div>\n);\nexport default Demo\n```\n\n### \u9009\u62e9\u548c\u64cd\u4f5c\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button, Checkbox, Pagination, Loader } from 'uiw';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n // \u9009\u4e2d\u7684 key\n checked: [],\n loading: false,\n dataSource: [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002' },\n ],\n columns: [\n {\n title: (data, rowNum, colNum) => {\n const indeterminate = this.state.dataSource.length !== this.state.checked.length && this.state.checked.length > 0;\n const checked = this.state.dataSource.length === this.state.checked.length;\n return (\n <Checkbox\n checked={checked}\n indeterminate={indeterminate}\n onClick={(evn) => {\n let checked = this.state.dataSource.map((item, idx) => idx);\n if(!evn.target.checked) {\n checked = [];\n }\n this.setState({ checked });\n }}\n />\n );\n },\n key: 'checked',\n render: (text, key, rowData, rowNumber, columnNumber) => {\n return (\n <Checkbox checked={rowData.checked} onClick={this.onClickCheckedItem.bind(this, rowNumber)} />\n );\n }\n }, {\n title: '\u540d\u5b57',\n key: 'name',\n }, {\n title: '\u5e74\u9f84',\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n },\n ]\n }\n }\n onClickCheckedItem(rowNumber, env) {\n let { checked } = this.state;\n const isChecked = env.target.checked;\n if(isChecked) {\n // \u6dfb\u52a0\u5230\u9009\u4e2d\u6570\u7ec4\u4e2d\n checked.push(rowNumber)\n checked = checked.sort((a, b) => a - b);\n } else {\n // \u5220\u9664\u9009\u4e2d\u9879\n checked.splice(checked.indexOf(rowNumber), 1);\n }\n this.setState({ checked });\n }\n render() {\n const { checked } = this.state;\n const dataSource = this.state.dataSource.map((item, idx) => {\n const isChecked = checked.indexOf(idx) > -1;\n return { checked: isChecked, ...item };\n });\n return (\n <div>\n <Loader loading={this.state.loading} style={{ display: 'block' }}>\n <Table\n columns={this.state.columns}\n data={dataSource}\n footer={\n <Pagination\n current={2}\n pageSize={10}\n total={30}\n divider\n onChange={(current, total, pageSize) => {\n this.setState({ loading: true });\n const timer = setTimeout(() => {\n // \u6a21\u62df\u53d8\u66f4\u6570\u636e\n const dataSource = this.state.dataSource.map(item => {\n item.age = Number(item.age) + current;\n return item;\n });\n // \u7ffb\u9875 API \u83b7\u53d6\u6570\u636e\n this.setState({ checked: [], dataSource, loading: false });\n }, 2000);\n }}\n />\n }\n />\n </Loader>\n </div>\n );\n }\n}\nexport default Demo\n```\n\n### \u81ea\u5b9a\u4e49\u5355\u5143\u683c\u7701\u7565\u63d0\u793a\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button, Notify, Tooltip } from 'uiw';\n\nconst columns = [\n {\n title: 'Name',\n key: 'name',\n render: text => <a>{text}</a>,\n width: 150,\n },\n {\n title: 'Age',\n key: 'age',\n width: 80,\n },\n {\n title: 'Address',\n key: 'address',\n ellipsis: true,\n render: address => (\n <Tooltip placement=\"topLeft\" content={address}>\n {address}\n </Tooltip>\n ),\n },\n {\n title: 'Long Column Long Column Long Column',\n key: 'address',\n ellipsis: true,\n render: address => (\n <Tooltip placement=\"topLeft\" content={address}>\n {address}\n </Tooltip>\n ),\n },\n {\n title: 'Long Column Long Column',\n key: 'address',\n ellipsis: true,\n render: address => (\n <Tooltip placement=\"topLeft\" content={address}>\n {address}\n </Tooltip>\n ),\n },\n {\n title: 'Long Column',\n key: 'address',\n ellipsis: true,\n render: address => {\n return (\n <Tooltip placement=\"topLeft\" content={address}>\n {address}\n </Tooltip>\n )\n },\n },\n];\n\nconst data = [\n { name: '\u9093\u7d2b\u68cb', age: '12', address: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002' },\n { name: '\u674e\u6613\u5cf0', age: '32', address: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba' },\n { name: '\u8303\u51b0\u51b0', age: '23', address: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b' },\n { name: '\u6768\u5e42', age: '34', address: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002' },\n { name: 'Angelababy', age: '54', address: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002' },\n { name: '\u5510\u5ae3', age: '12', address: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed' },\n { name: '\u5434\u4ea6\u51e1', age: '4', address: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002' },\n];\n\nconst Demo = () => (\n <div>\n <Table\n title=\"\u8868\u5185\u5bb9 tbody \u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03\u4e8b\u4ef6\"\n columns={columns}\n data={data}\n />\n </div>\n);\nexport default Demo\n```\n\n### \u65e0\u6570\u636e\u72b6\u6001\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button, Empty } from 'uiw';\n\nconst columns = [\n {\n ellipsis: true, \n title: '\u59d3\u540d',\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [];\nconst Demo = () => (\n <div>\n <Table\n columns={columns}\n data={dataSource}\n empty={<Empty />} \n />\n </div>\n);\nexport default Demo\n```\n\n### \u53ef\u5c55\u5f00\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button, Icon } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n key: 'name', \n }, \n {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n }, \n {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '10', id: '1'},\n { name: '\u674e\u6613\u5cf0', age: '32', id: '2'},\n { name: '\u8303\u51b0\u51b0', age: '23', id: '3'},\n];\nconst Demo = () => (\n <div>\n <Table \n rowKey=\"id\"\n expandable={{\n expandedRowRender: (record, index, expanded)=>{\n return <div>{record.name}</div>\n },\n // defaultExpandAllRows: true,\n rowExpandable: (r)=>r.name!=='\u674e\u6613\u5cf0',\n expandIcon: (expanded) => expanded ? <Icon type=\"minus-circle-o\"/> : <Icon type=\"plus-circle-o\"/>,\n defaultExpandedRowKeys: [\"1\"]\n }}\n columns={columns} \n data={dataSource} \n />\n </div>\n);\nexport default Demo\n```\n\n### \u6811\u5f62\u6570\u636e\u5c55\u793a\n\n\u8868\u683c\u652f\u6301\u6811\u5f62\u6570\u636e\u7684\u5c55\u793a\uff0c\u5f53\u6570\u636e\u4e2d\u6709 children \u5b57\u6bb5\u65f6\u4f1a\u81ea\u52a8\u5c55\u793a\u4e3a\u6811\u5f62\u8868\u683c\uff0c\u5982\u679c\u4e0d\u9700\u8981\u6216\u914d\u7f6e\u4e3a\u5176\u4ed6\u5b57\u6bb5\u53ef\u4ee5\u7528 childrenColumnName \u8fdb\u884c\u914d\u7f6e\u3002\n\n\u53ef\u4ee5\u901a\u8fc7\u8bbe\u7f6e indentSize \u4ee5\u63a7\u5236\u6bcf\u4e00\u5c42\u7684\u7f29\u8fdb\u5bbd\u5ea6\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button, Icon } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n key: 'name', \n }, \n {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n }, \n {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { \n name: '\u9093\u7d2b\u68cb', \n age: '10', \n id: '1', \n children: [\n {\n name: '\u9093\u7d2b\u68cb-0-1', \n age: '10', \n id: '1-1', \n children: [\n { \n name: '\u9093\u7d2b\u68cb-0-1-1', \n age: '10', \n id: '1-1-1',\n children: [\n {name: '\u9093\u7d2b\u68cb-0-1-1-1', age: '10', id: '-0-1-1-1'},\n {name: '\u9093\u7d2b\u68cb-0-1-1-2', age: '10', id: '-0-1-1-2'},\n {name: '\u9093\u7d2b\u68cb-0-1-1-3', age: '10', id: '-0-1-1-3'},\n ]\n },\n { name: '\u9093\u7d2b\u68cb-0-1-2', age: '10', id: '1-1-2',}\n ]\n },\n {name: '\u9093\u7d2b\u68cb-0-2', age: '10', id: '1-1'},\n {name: '\u9093\u7d2b\u68cb-0-3', age: '10', id: '1-1'},\n ]\n },\n { name: '\u674e\u6613\u5cf0', age: '32', id: '2',},\n { name: '\u8303\u51b0\u51b0', age: '23', id: '3', \n children: [\n {name: '\u8303\u51b0\u51b00-1', age: '23', id: '3-1'},\n {name: '\u8303\u51b0\u51b00-2', age: '23', id: '3-2'},\n {name: '\u8303\u51b0\u51b00-3', age: '23', id: '3-3'},\n ]\n },\n];\nconst Demo = () => {\n const [expandedRowKeys, setExpandedRowKeys] = React.useState([])\n return (\n <div>\n <Table \n rowKey=\"id\"\n columns={columns}\n data={dataSource}\n />\n </div>\n )\n};\nexport default Demo\n```\n\n### \u8868\u683c\u5217\u8fc7\u5bbd\u5bfc\u81f4 footer \u6ed1\u52a8\u51fa\u8868\u683c\u5e95\u90e8\n\n\u4f7f\u7528 scroll \u5c5e\u6027\u7ed9\u8868\u683c\u8bbe\u7f6e\u5bbd(x)\u6216\u9ad8(y)\u5373\u53ef\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n // title: '\u59d3\u540d',\n ellipsis: true, \n width: 1000,\n title: ({ key }) => {\n return (\n <span>\u5b57\u6bb5: {key}</span>\n )\n },\n key: 'name', \n }, {\n title: '\u5e74\u9f84',\n style: { color: 'red' },\n key: 'age',\n }, {\n title: '\u5730\u5740',\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table \n scroll={{x: 1800, y: 100}}\n footer={<div style={{height: 20, }}>\u8fd9\u4e2a\u662ffooter</div>}\n columns={columns} data={dataSource} \n />\n </div>\n);\nexport default Demo\n```\n\n### \u56fa\u5b9a\u5217 \n\n\u901a\u8fc7\u4f7f\u7528 fixed \u4f7f\u5176\u5217\u56fa\u5b9a\n> \u26a0\ufe0f \u6ce8\u610f: \u82e5\u5e76\u6ca1\u6709 scroll \u6eda\u52a8\u6761\uff0cfixed \u5c5e\u6027\u5e76\u4e0d\u4f1a\u6709\u76f4\u89c2\u7684\u6548\u679c\n\x3c!--rehype:style=border-left: 8px solid #ffe564;background-color: #ffe56440;padding: 12px 16px;--\x3e\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button } from 'uiw';\n\nconst columns = [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n // fixed: true,\n width: 50,\n key: 'name', \n }, {\n // fixed: true,\n title: '\u5e74\u9f84',\n width: 50,\n style: { color: 'red' },\n key: 'age',\n }, {\n title: '\u5730\u5740',\n width: 50,\n key: 'info',\n }, {\n title: '\u64cd\u4f5c',\n key: 'edit',\n width: 98,\n fixed: 'right',\n render: (text, key, rowData, rowNumber, columnNumber) => (\n <div>\n <Button size=\"small\" type=\"danger\">\u5220\u9664</Button>\n <Button size=\"small\" type=\"success\">\u4fee\u6539</Button>\n </div>\n ),\n },\n];\nconst dataSource = [\n { name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973\u6b4c\u624b\u3002', edit: '' },\n { name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', edit: '' },\n { name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', edit: '' },\n { name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002', edit: '' },\n { name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', edit: '' },\n { name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', edit: '' },\n { name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', edit: '' },\n];\nconst Demo = () => (\n <div>\n <Table scroll={{x: 1200}} bordered columns={columns} data={dataSource} />\n </div>\n);\nexport default Demo\n```\n\n### \u53ef\u7f16\u8f91\n\n\u5229\u7528 render \u5c5e\u6027, \u4f20\u9012\u81ea\u5b9a\u4e49\u7ec4\u4ef6\u5b9e\u73b0\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button, Input, Select } from 'uiw';\n\nconst columns = (onChange) => [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n key: 'name', \n render: (text,key, rowData) => {\n return <EditInput \n value={text} \n onChange={(value)=>{\n onChange({...rowData, name: value}, rowData.id)\n }} \n />\n }\n }, \n {\n title: '\u6027\u522b',\n key: 'gender',\n render: (text,key, rowData) => {\n return <EditInput \n value={text} \n component=\"Select\"\n onChange={(value)=>{\n onChange({...rowData, gender: value}, rowData.id)\n }} \n />\n }\n },\n {\n title: '\u5e74\u9f84',\n key: 'age',\n render: (text,key, rowData) => {\n return <EditInput \n value={text} \n type=\"number\"\n onChange={(value)=>{\n onChange({...rowData, age: value}, rowData.id)\n }} \n />\n }\n }, \n {\n title: '\u5730\u5740',\n key: 'info',\n render: (text,key, rowData) => {\n return <EditInput \n value={text} \n onChange={(value)=>{\n onChange({...rowData, info: value}, rowData.id)\n }} \n />\n }\n }, \n];\nconst dataSource = [\n { id: 1, gender: \"\u7537\", name: '\u9093\u7d2b\u68cb', age: '12', info: '\u53c8\u540dG.E.M.\uff0c\u539f\u540d\u9093\u8bd7\u9896\uff0c1991\u5e748\u670816\u65e5\u751f\u4e8e\u4e2d\u56fd\u4e0a\u6d77\uff0c\u4e2d\u56fd\u9999\u6e2f\u521b\u4f5c\u578b\u5973'},\n { id: 2, gender: \"\u7537\", name: '\u674e\u6613\u5cf0', age: '32', info: '1987\u5e745\u67084\u65e5\u51fa\u751f\u4e8e\u56db\u5ddd\u6210\u90fd\uff0c\u4e2d\u56fd\u5185\u5730\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba', },\n { id: 3, gender: \"\u7537\", name: '\u8303\u51b0\u51b0', age: '23', info: '1981\u5e749\u670816\u65e5\u51fa\u751f\u4e8e\u5c71\u4e1c\u9752\u5c9b\uff0c\u4e2d\u56fd\u5f71\u89c6\u5973\u6f14\u5458\u3001\u5236\u7247\u4eba\u3001\u6d41\u884c\u4e50\u5973\u6b4c\u624b', },\n { id: 4, gender: \"\u7537\", name: '\u6768\u5e42', age: '34', info: '1986\u5e749\u670812\u65e5\u51fa\u751f\u4e8e\u5317\u4eac\u5e02\uff0c\u4e2d\u56fd\u5185\u5730\u5f71\u89c6\u5973\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3001\u5f71\u89c6\u5236\u7247\u4eba\u3002'},\n { id: 5, gender: \"\u7537\", name: 'Angelababy', age: '54', info: '1989\u5e742\u670828\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u5973\u6f14\u5458\u3001\u65f6\u5c1a\u6a21\u7279\u3002', },\n { id: 6, gender: \"\u7537\", name: '\u5510\u5ae3', age: '12', info: '1983\u5e7412\u67086\u65e5\u51fa\u751f\u4e8e\u4e0a\u6d77\u5e02\uff0c\u6bd5\u4e1a\u4e8e\u4e2d\u592e\u620f\u5267\u5b66\u9662\u8868\u6f14\u7cfb\u672c\u79d1\u73ed', },\n { id: 7, gender: \"\u7537\", name: '\u5434\u4ea6\u51e1', age: '4', info: '1990\u5e7411\u670806\u65e5\u51fa\u751f\u4e8e\u5e7f\u4e1c\u7701\u5e7f\u5dde\u5e02\uff0c\u534e\u8bed\u5f71\u89c6\u7537\u6f14\u5458\u3001\u6d41\u884c\u4e50\u6b4c\u624b\u3002', },\n];\nconst EditInput = ({edit, value, type, onChange, component, ...other}) => {\n const [isEdit, setIsEdit] = React.useState(edit);\n const inputRef = React.useRef();\n React.useEffect(()=>{\n isEdit && inputRef.current.focus()\n }, [isEdit])\n if(isEdit) {\n if(component === \"Select\") {\n return <Select \n ref={inputRef}\n defaultValue={value} \n onBlur={e=>{\n onChange(e.target.value)\n setIsEdit(false)\n }}\n >\n <Select.Option value=\"\u7537\">\u7537</Select.Option>\n <Select.Option value=\"\u5973\">\u5973</Select.Option>\n </Select>\n }\n return <Input \n {...other}\n defaultValue={value} \n ref={inputRef} \n type={type || \"text\"}\n onBlur={(e)=>{\n onChange(e.target.value)\n setIsEdit(false)\n }}\n />\n }\n return <div onClick={()=>{\n setIsEdit(true)\n }}>{value}</div>\n}\nconst Demo = () => {\n const [data, setData] = React.useState(dataSource)\n const onChange = (value, id) => {\n setData(data.map(it=>it.id === id ? value : it))\n }\n return <div>\n <Table columns={columns(onChange)} data={data} />\n </div>\n};\nexport default Demo\n```\n\n### \u53ef\u7f16\u8f91\u884c\n\n\u5229\u7528 Form \u7ec4\u4ef6\u548c render \u5c5e\u6027, \u5b9e\u73b0\u7f16\u8f91\u884c\u6548\u679c\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Table, Button, Input, Select, Form, Notify } from 'uiw';\n\nconst columns = (actived, setChange, fields) => {\n return [\n {\n title: '\u59d3\u540d',\n ellipsis: true, \n key: 'name', \n render: (text,key, rowData) => {\n if(rowData.id === actived) return fields.name\n return text\n }\n }, \n {\n title: '\u6027\u522b',\n key: 'gender',\n render: (text,key, rowData) => {\n if(rowData.id === actived) return fields.gender\n return text\n }\n },\n {\n title: '\u5e74\u9f84',\n key: 'age',\n render: (text,key, rowData) => {\n if(rowData.id === actived) return fields.age\n return text\n }\n }, \n {\n key: 'id',\n render: (id, key, rowData)=>{\n const flag = id === actived\n if(flag){\n return <>\n <Button type=\"primary\" htmlType=\"submit\">Save</Button>\n <Button type=\"danger\" onClick={()=>setChange({})}>Cancel</Button>\n </>\n }\n return <Button \n type=\"primary\" \n onClick={(e)=>{\n e.preventDefault();\n setChange(rowData)\n }} \n disabled={actived !== undefined && !flag}\n >Edit</Button>\n }\n }\n ]\n};\nconst dataSource = [\n { id: 1, gender: \"\u7537\", name: '\u9093\u7d2b\u68cb', age: '12', },\n { id: 2, gender: \"\u7537\", name: '\u674e\u6613\u5cf0', age: '32', },\n { id: 3, gender: \"\u7537\", name: '\u8303\u51b0\u51b0', age: '23', },\n { id: 4, gender: \"\u7537\", name: '\u6768\u5e42', age: '34',},\n { id: 5, gender: \"\u7537\", name: 'Angelababy', age: '54', },\n { id: 6, gender: \"\u7537\", name: '\u5510\u5ae3', age: '12', },\n { id: 7, gender: \"\u7537\", name: '\u5434\u4ea6\u51e1', age: '4', },\n];\nconst Demo = () => {\n const [data, setData] = React.useState(dataSource)\n const [itemRowData, setItemRowData] = React.useState({})\n const [id, setId] = React.useState()\n \n const form = React.useRef()\n const setChange = (rowData) => {\n setId(rowData.id)\n setItemRowData(rowData)\n form.current.setFields(rowData)\n }\n\n return <Form\n ref={form}\n onSubmit={({ current }) => {\n if(JSON.stringify(itemRowData) === JSON.stringify(current)) {\n Notify.error({\n title: '\u63d0\u4ea4\u5931\u8d25\uff01',\n description: `\u8868\u5355\u63d0\u4ea4\u5185\u5bb9\u5e76\u6ca1\u6709\u4fee\u6539\uff01`,\n });\n return \n }\n setData(data.map(it=>it.id === current.id ? current : it))\n setId(undefined)\n Notify.success({\n title: '\u63d0\u4ea4\u6210\u529f\uff01',\n description: '\u6570\u636e\u5df2\u7ecf\u66f4\u65b0'\n });\n }}\n fields={{\n name: {\n children: <Input placeholder=\"\u8bf7\u8f93\u5165\u59d3\u540d\" />\n },\n age: {\n children: <Input placeholder=\"\u8bf7\u8f93\u5165\u5e74\u9f84\" type=\"number\" />\n },\n gender: {\n children: <Select>\n <Select.Option value=\"\u7537\">\u7537</Select.Option>\n <Select.Option value=\"\u5973\">\u5973</Select.Option>\n </Select>\n }\n }}\n >\n {({ fields }) => <Table columns={columns(id, setChange, fields)} data={data} />}\n </Form>\n};\nexport default Demo\n```\n\n## Props\n\n### Table\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| columns | \u8868\u683c\u5217\u7684\u914d\u7f6e\u63cf\u8ff0\uff0c\u53ef\u4ee5\u5185\u5d4c `children`\uff0c\u4ee5\u6e32\u67d3\u5206\u7ec4\u8868\u5934\u3002| ColumnProps[] | `[]` |\n| data | \u6570\u636e\u6570\u7ec4\u3002| Array[] | `[]` |\n| title | \u8868\u683c\u6807\u9898 | ~~Function(text, key, rowData, rowNumber, columnNumber)~~ /<br/> Function(data: IColumns, rowNum: Number, colNum: Number)`@3.0.0+` /<br/> String / ReactNode | - |\n| footer | \u8868\u683c\u5c3e\u90e8 | String/ReactNode | - |\n| bordered | \u662f\u5426\u5c55\u793a\u5916\u8fb9\u6846\u548c\u5217\u8fb9\u6846 | Boolean | - |\n| empty | \u65e0\u6570\u636e\u72b6\u6001 | ReactNode | - |\n| onCellHead | \u8868\u5934\u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03 | ~~`Function(text, key, rowData, rowNumber, columnNumber)`~~ /<br/> Function(data: IColumns, colNum: Number, rowNum: Number, evn: React.MouseEvent<HTMLTableCellElement\\>) `@3.0.0+` | - |\n| onCell | \u5355\u5143\u683c\u70b9\u51fb\u56de\u8c03 | ~~`Function(text, key, rowData, rowNumber, columnNumber)`~~ /<br/> Function(data: IColumns, options:{ colNum: Number, rowNum: Number, keyName: String }, evn: React.MouseEvent<HTMLTableCellElement\\>) `@3.1.0+` | - |\n| expandable | \u53ef\u5c55\u5f00\u914d\u7f6e | ExpandableType | - |\n| rowKey | \u8868\u683c\u884c key \u7684\u53d6\u503c | String | - |\n| scroll | \u8868\u683c\u662f\u5426\u53ef\u6eda\u52a8\uff0c\u4e5f\u53ef\u4ee5\u6307\u5b9a\u6eda\u52a8\u533a\u57df\u7684\u5bbd\u3001\u9ad8 | { x?: React.CSSProperties['width'], y?: React.CSSProperties['height'] } | - |\n\n\n### ColumnProps\n\n\u5217\u63cf\u8ff0\u6570\u636e\u5bf9\u8c61\uff0c\u662f columns \u4e2d\u7684\u4e00\u9879\uff0c\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c | \u7248\u672c |\n|--------- |-------- |--------- |-------- |-------- |\n| title | \u5217\u5934\u663e\u793a\u6587\u5b57\u3002| ReactNode | - | - |\n| key | \u9700\u8981\u7684 key\uff0c\u53ef\u4ee5\u5ffd\u7565\u8fd9\u4e2a\u5c5e\u6027\uff0c\u5982\u679c\u6807\u9898\u5e26\u6709 `render` \u51fd\u6570\uff0c\u90a3\u4e48\u8fd9\u4e2a `key` \u4e3a\u5fc5\u987b\u975e\u5e38\u91cd\u8981\u3002| String | - | - |\n| width | \u5217\u5bbd\u5ea6\u3002| Number | - | - |\n| colSpan | \u5408\u5e76\u8868\u5934\u884c\u3002| Number | - | - |\n| ellipsis | \u8d85\u8fc7\u5bbd\u5ea6\u5c06\u81ea\u52a8\u7701\u7565\u3002`v4.8.7+`| Boolean | `false` | - |\n| render | \u751f\u6210\u590d\u6742\u6570\u636e\u7684\u6e32\u67d3\u51fd\u6570\uff0c\u53c2\u6570\u5206\u522b\u4e3a\u5f53\u524d\u884c\u7684\u503c\uff0c\u5f53\u524d\u503c\u7684 `key`\uff0c\u884c\u7d22\u5f15\u6570\u636e\uff0c\u5f53\u524d\u884c\u53f7\uff0c\u5f53\u524d\u5217\u53f7\u3002| `Function(text, key, rowData, rowNumber, columnNumber)` | - | - |\n| align | \u8bbe\u7f6e\u5217\u7684\u5bf9\u9f50\u65b9\u5f0f | \"left\"\\|\"center\"\\|\"right\" | - | - |\n| className | \u5217\u6837\u5f0f\u7c7b\u540d | String | - | - |\n| fixed | \u628a\u9009\u62e9\u6846\u5217\u56fa\u5b9a\t | Boolean \\|\"left\"\\|\"right\" | - | 4.15.1 |\n\n### expandable\n\n> \u26a0\ufe0f \u6ce8\u610f: expandedRowKeys \u4e0e onExpandedRowsChange \u5fc5\u987b\u540c\u65f6\u51fa\u73b0\u6216\u4e0d\u51fa\u73b0\n\x3c!--rehype:style=border-left: 8px solid #ffe564;background-color: #ffe56440;padding: 12px 16px;--\x3e\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| expandedRowRender | \u81ea\u5b9a\u4e49\u5c55\u5f00\u884c| (record, index, expanded) => React.ReactNode | - |\n| expandIcon | \u81ea\u5b9a\u4e49\u56fe\u6807 | (expanded, record, index) => React.ReactNode; | - |\n| rowExpandable | \u662f\u5426\u5141\u8bb8\u5c55\u5f00| (record)=>Boolean | - |\n| defaultExpandAllRows | \u521d\u59cb\u65f6\uff0c\u662f\u5426\u5c55\u5f00\u6240\u6709\u884c| Boolean | false |\n| defaultExpandedRowKeys | \u521d\u59cb\u65f6\uff0c\u9ed8\u8ba4\u5c55\u5f00\u7684\u884c\trowKey\u6570\u7ec4 | Array | - |\n| expandedRowKeys | \u63a7\u5236\u5c55\u5f00\u7684\u884c\trowKey\u6570\u7ec4 | Array | - |\n| onExpandedRowsChange | \u5c55\u5f00\u7684\u884c\u53d8\u5316\u89e6\u53d1 | (expandedRows)=>void | - |\n| onExpand | \u70b9\u51fb\u5c55\u5f00\u56fe\u6807\u89e6\u53d1 | (expanded,record,index)=>void | - |\n| indentSize | \u63a7\u5236\u6811\u5f62\u7ed3\u6784\u6bcf\u4e00\u5c42\u7684\u7f29\u8fdb\u5bbd\u5ea6 | Number | 16 |\n| childrenColumnName | \u6307\u5b9a\u6811\u5f62\u7ed3\u6784\u7684\u5217\u540d | String | children |\n"}}}]);
|
|
2
|
+
//# sourceMappingURL=9699.5cf9381a.chunk.js.map
|