npm - @uiw/doc - Versions diffs - 5.0.0-bate-1 → 5.0.0-bate-4 - Mend

@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.

Files changed (349) hide show

package/web/static/js/8110.c0ad97fe.chunk.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- "use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite\|\|[]).push([[8110],{8110:function(e,t,n){n.r(t),t.default={components:{20:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);return function(){return t.default.createElement("div",null,t.default.createElement(r.Card,{title:"Card\u6807\u9898",extra:t.default.createElement("a",{href:"#"},"\u66f4\u591a"),style:{width:300}},"\u5361\u7247\u5185\u5bb9",t.default.createElement("br",null),"\u5361\u7247\u5185\u5bb9",t.default.createElement("br",null),"\u5361\u7247\u5185\u5bb9",t.default.createElement("br",null)))}}(),40:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);return function(){return t.default.createElement(r.Card,{title:"Card\u6807\u9898",bordered:!1,style:{width:300}},"\u5361\u7247\u5185\u5bb9",t.default.createElement("br",null),"\u5361\u7247\u5185\u5bb9",t.default.createElement("br",null),"\u5361\u7247\u5185\u5bb9",t.default.createElement("br",null))}}(),58:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);return function(){return t.default.createElement(r.Card,{style:{width:300}},"\u5361\u7247\u5185\u5bb9",t.default.createElement("br",null),"\u5361\u7247\u5185\u5bb9",t.default.createElement("br",null),"\u5361\u7247\u5185\u5bb9",t.default.createElement("br",null))}}(),76:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);var a={padding:"10px 16px"};return function(){return t.default.createElement(r.Card,{style:{width:240},bodyStyle:{padding:10}},t.default.createElement("div",null,t.default.createElement("img",{alt:"example",width:"100%",src:"https://avatars1.githubusercontent.com/u/1680273?v=4"})),t.default.createElement("div",{style:a},t.default.createElement("h3",{style:{margin:0}},"\u6211\u7231\u6f02\u4eae\u59b9\u59b9"),t.default.createElement("p",{style:{margin:0}},t.default.createElement("a",{href:"https://uiwjs.github.io"},"https://uiwjs.github.io"))))}}(),98:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);var a=t.default.createElement("a",{href:"https://uiwjs.github.io"},t.default.createElement(r.Icon,{type:"user"}),"\xa0 16 Friends");return function(){return t.default.createElement(r.Card,{title:"Card\u6807\u9898",footer:a,style:{width:240},bodyStyle:{padding:0}},t.default.createElement("div",null,t.default.createElement("img",{alt:"example",width:"100%",src:"https://avatars1.githubusercontent.com/u/1680273?v=4"})),t.default.createElement("div",{style:{padding:"10px 16px"}},t.default.createElement("h3",{style:{margin:0}},"\u6211\u7231\u6f02\u4eae\u59b9\u59b9"),t.default.createElement("p",{style:{margin:0}},t.default.createElement("a",{href:"https://uiwjs.github.io"},"https://uiwjs.github.io"))))}}(),132:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);var a=t.default.createElement("a",{href:"https://uiwjs.github.io"},t.default.createElement(r.Icon,{type:"user"}),"\xa0 16 Friends");return function(){return t.default.createElement(r.Card,{active:!0,title:"Card\u6807\u9898",footer:a,style:{width:240},bodyStyle:{padding:0}},t.default.createElement("div",null,t.default.createElement("img",{alt:"example",width:"100%",src:"https://avatars1.githubusercontent.com/u/1680273?v=4"})),t.default.createElement("div",{style:{padding:"10px 16px"}},t.default.createElement("h3",{style:{margin:0}},"\u6211\u7231\u6f02\u4eae\u59b9\u59b9"),t.default.createElement("p",{style:{margin:0}},t.default.createElement("a",{href:"https://uiwjs.github.io"},"https://uiwjs.github.io"))))}}()},data:{20:{name:20,meta:{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 Demo() {\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Card, {\n title: "Card\\u6807\\u9898",\n extra: /#__PURE__/_react["default"].createElement("a", {\n href: "#"\n }, "\\u66F4\\u591A"),\n style: {\n width: 300\n }\n }, "\\u5361\\u7247\\u5185\\u5BB9", /#__PURE__/_react["default"].createElement("br", null), "\\u5361\\u7247\\u5185\\u5BB9", /#__PURE__/_react["default"].createElement("br", null), "\\u5361\\u7247\\u5185\\u5BB9", /#__PURE__/_react["default"].createElement("br", null)));\n}\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Card } from 'uiw';\n\nfunction Demo () {\n return <div>\n <Card title=\"Card\u6807\u9898\" extra={<a href=\"#\">\u66f4\u591a</a>} style={{ width: 300 }}>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n </Card>\n </div>\n}\nexport default Demo"},40:{name:40,meta:{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 Demo() {\n return /#__PURE__/_react["default"].createElement(_uiw.Card, {\n title: "Card\\u6807\\u9898",\n bordered: false,\n style: {\n width: 300\n }\n }, "\\u5361\\u7247\\u5185\\u5BB9", /#__PURE__/_react["default"].createElement("br", null), "\\u5361\\u7247\\u5185\\u5BB9", /#__PURE__/_react["default"].createElement("br", null), "\\u5361\\u7247\\u5185\\u5BB9", /#__PURE__/_react["default"].createElement("br", null));\n}\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Card } from 'uiw';\n\nfunction Demo() {\n return <Card title=\"Card\u6807\u9898\" bordered={false} style={{ width: 300 }}>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n </Card>\n}\nexport default Demo"},58:{name:58,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 Demo() {\n return /#__PURE__/_react["default"].createElement(_uiw.Card, {\n style: {\n width: 300\n }\n }, "\\u5361\\u7247\\u5185\\u5BB9", /#__PURE__/_react["default"].createElement("br", null), "\\u5361\\u7247\\u5185\\u5BB9", /#__PURE__/_react["default"].createElement("br", null), "\\u5361\\u7247\\u5185\\u5BB9", /#__PURE__/_react["default"].createElement("br", null));\n}\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Card } from 'uiw';\n\nfunction Demo() {\n return <Card style={{ width: 300 }}>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n </Card>\n}\nexport default Demo"},76:{name:76,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 titleStyle = {\n padding: "10px 16px"\n};\n\nfunction Demo() {\n return /#__PURE__/_react["default"].createElement(_uiw.Card, {\n style: {\n width: 240\n },\n bodyStyle: {\n padding: 10\n }\n }, /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement("img", {\n alt: "example",\n width: "100%",\n src: "https://avatars1.githubusercontent.com/u/1680273?v=4"\n })), /#__PURE__/_react["default"].createElement("div", {\n style: titleStyle\n }, /#__PURE__/_react["default"].createElement("h3", {\n style: {\n margin: 0\n }\n }, "\\u6211\\u7231\\u6F02\\u4EAE\\u59B9\\u59B9"), /#__PURE__/_react["default"].createElement("p", {\n style: {\n margin: 0\n }\n }, /#__PURE__/_react["default"].createElement("a", {\n href: "https://uiwjs.github.io"\n }, "https://uiwjs.github.io"))));\n}\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Card } from \'uiw\';\n\nlet titleStyle = { padding: `10px 16px` };\n\nfunction Demo() {\n return <Card style={{ width: 240 }} bodyStyle={{ padding: 10 }}>\n <div>\n <img alt="example" width="100%" src="https://avatars1.githubusercontent.com/u/1680273?v=4" />\n </div>\n <div style={titleStyle}>\n <h3 style={{margin:0}}>\u6211\u7231\u6f02\u4eae\u59b9\u59b9</h3>\n <p style={{margin:0}}><a href="https://uiwjs.github.io">https://uiwjs.github.io</a></p>\n </div>\n </Card>\n}\nexport default Demo'},98:{name:98,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 footer = /#__PURE__/_react["default"].createElement("a", {\n href: "https://uiwjs.github.io"\n}, /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "user"\n}), "\\xA0 16 Friends");\n\nfunction Demo() {\n return /#__PURE__/_react["default"].createElement(_uiw.Card, {\n title: "Card\\u6807\\u9898",\n footer: footer,\n style: {\n width: 240\n },\n bodyStyle: {\n padding: 0\n }\n }, /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement("img", {\n alt: "example",\n width: "100%",\n src: "https://avatars1.githubusercontent.com/u/1680273?v=4"\n })), /#__PURE__/_react["default"].createElement("div", {\n style: {\n padding: "10px 16px"\n }\n }, /#__PURE__/_react["default"].createElement("h3", {\n style: {\n margin: 0\n }\n }, "\\u6211\\u7231\\u6F02\\u4EAE\\u59B9\\u59B9"), /#__PURE__/_react["default"].createElement("p", {\n style: {\n margin: 0\n }\n }, /#__PURE__/_react["default"].createElement("a", {\n href: "https://uiwjs.github.io"\n }, "https://uiwjs.github.io"))));\n}\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Card, Icon } from \'uiw\';\n\nconst footer = (\n <a href="https://uiwjs.github.io">\n <Icon type=\'user\' /> \n 16 Friends\n </a>\n)\n\nfunction Demo() {\n return <Card\n title="Card\u6807\u9898"\n footer={footer}\n style={{ width: 240 }} \n bodyStyle={{ padding: 0 }}\n >\n <div>\n <img alt="example" width="100%" src="https://avatars1.githubusercontent.com/u/1680273?v=4" />\n </div>\n <div style={{ padding: `10px 16px` }}>\n <h3 style={{margin:0}}>\u6211\u7231\u6f02\u4eae\u59b9\u59b9</h3>\n <p style={{margin:0}}><a href="https://uiwjs.github.io">https://uiwjs.github.io</a></p>\n </div>\n </Card>\n}\nexport default Demo'},132:{name:132,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 footer = /#__PURE__/_react["default"].createElement("a", {\n href: "https://uiwjs.github.io"\n}, /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "user"\n}), "\\xA0 16 Friends");\n\nfunction Demo() {\n return /#__PURE__/_react["default"].createElement(_uiw.Card, {\n active: true,\n title: "Card\\u6807\\u9898",\n footer: footer,\n style: {\n width: 240\n },\n bodyStyle: {\n padding: 0\n }\n }, /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement("img", {\n alt: "example",\n width: "100%",\n src: "https://avatars1.githubusercontent.com/u/1680273?v=4"\n })), /#__PURE__/_react["default"].createElement("div", {\n style: {\n padding: "10px 16px"\n }\n }, /#__PURE__/_react["default"].createElement("h3", {\n style: {\n margin: 0\n }\n }, "\\u6211\\u7231\\u6F02\\u4EAE\\u59B9\\u59B9"), /#__PURE__/_react["default"].createElement("p", {\n style: {\n margin: 0\n }\n }, /#__PURE__/_react["default"].createElement("a", {\n href: "https://uiwjs.github.io"\n }, "https://uiwjs.github.io"))));\n}\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Card, Icon } from \'uiw\';\n\nconst footer = (\n <a href="https://uiwjs.github.io">\n <Icon type=\'user\' /> \n 16 Friends\n </a>\n)\n\nfunction Demo() {\n return <Card\n active\n title="Card\u6807\u9898"\n footer={footer}\n style={{ width: 240 }} \n bodyStyle={{ padding: 0 }}\n >\n <div>\n <img alt="example" width="100%" src="https://avatars1.githubusercontent.com/u/1680273?v=4" />\n </div>\n <div style={{ padding: `10px 16px` }}>\n <h3 style={{margin:0}}>\u6211\u7231\u6f02\u4eae\u59b9\u59b9</h3>\n <p style={{margin:0}}><a href="https://uiwjs.github.io">https://uiwjs.github.io</a></p>\n </div>\n </Card>\n}\nexport default Demo'}},source:'Card \u5361\u7247\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-card/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-card.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-card)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-card.svg?label=@uiw/react-card)](https://npmjs.com/@uiw/react-card)\n\n\u901a\u7528\u5361\u7247\u5bb9\u5668\uff0c\u5c06\u4fe1\u606f\u805a\u5408\u5728\u5361\u7247\u5bb9\u5668\u4e2d\u5c55\u793a\uff0c\u7528\u6765\u663e\u793a\u6587\u5b57\u3001\u5217\u8868\u3001\u56fe\u6587\u7b49\u5185\u5bb9\u3002\n\n```jsx\nimport { Card } from \'uiw\';\n// or\nimport Card from \'@uiw/react-card\';\n```\n\n## \u57fa\u7840\u7528\u6cd5\n\n\u5305\u542b\u6807\u9898\u3001\u5185\u5bb9\u3001\u64cd\u4f5c\u533a\u57df\u3002\n\n```jsx mdx:preview&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Card } from \'uiw\';\n\nfunction Demo () {\n return <div>\n <Card title="Card\u6807\u9898" extra={<a href="#">\u66f4\u591a</a>} style={{ width: 300 }}>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n </Card>\n </div>\n}\nexport default Demo\n```\n\n## \u65e0\u8fb9\u6846\n\n\u5728\u7070\u8272\u80cc\u666f\u4e0a\u4f7f\u7528\u65e0\u8fb9\u6846\u7684\u5361\u7247\u3002\n\n```jsx mdx:preview&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Card } from \'uiw\';\n\nfunction Demo() {\n return <Card title="Card\u6807\u9898" bordered={false} style={{ width: 300 }}>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n </Card>\n}\nexport default Demo\n```\n\n## \u7b80\u6d01\u5361\u7247\n\n\u53ea\u5305\u542b\u5185\u5bb9\u533a\u57df\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Card } from \'uiw\';\n\nfunction Demo() {\n return <Card style={{ width: 300 }}>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n \u5361\u7247\u5185\u5bb9<br/>\n </Card>\n}\nexport default Demo\n```\n\n## \u66f4\u7075\u6d3b\u7684\u5185\u5bb9\u5c55\u793a\n\n\u53ef\u4ee5\u8c03\u6574\u9ed8\u8ba4\u8fb9\u8ddd\uff0c\u8bbe\u5b9a\u5bbd\u5ea6\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Card } from \'uiw\';\n\nlet titleStyle = { padding: `10px 16px` };\n\nfunction Demo() {\n return <Card style={{ width: 240 }} bodyStyle={{ padding: 10 }}>\n <div>\n <img alt="example" width="100%" src="https://avatars1.githubusercontent.com/u/1680273?v=4" />\n </div>\n <div style={titleStyle}>\n <h3 style={{margin:0}}>\u6211\u7231\u6f02\u4eae\u59b9\u59b9</h3>\n <p style={{margin:0}}><a href="https://uiwjs.github.io">https://uiwjs.github.io</a></p>\n </div>\n </Card>\n}\nexport default Demo\n```\n\n## \u6dfb\u52a0\u9875\u811a\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Card, Icon } from \'uiw\';\n\nconst footer = (\n <a href="https://uiwjs.github.io">\n <Icon type=\'user\' /> \n 16 Friends\n </a>\n)\n\nfunction Demo() {\n return <Card\n title="Card\u6807\u9898"\n footer={footer}\n style={{ width: 240 }} \n bodyStyle={{ padding: 0 }}\n >\n <div>\n <img alt="example" width="100%" src="https://avatars1.githubusercontent.com/u/1680273?v=4" />\n </div>\n <div style={{ padding: `10px 16px` }}>\n <h3 style={{margin:0}}>\u6211\u7231\u6f02\u4eae\u59b9\u59b9</h3>\n <p style={{margin:0}}><a href="https://uiwjs.github.io">https://uiwjs.github.io</a></p>\n </div>\n </Card>\n}\nexport default Demo\n```\n\n## \u6fc0\u6d3b\n\n\u8bbe\u7f6e\u5c5e\u6027 `active=true` \u5c06\u6fc0\u6d3b\u5361\u7247\uff0c\u9ed8\u8ba4\u5c55\u793a\u9f20\u6807\u7ecf\u8fc7\u7684\u6837\u5f0f\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Card, Icon } from \'uiw\';\n\nconst footer = (\n <a href="https://uiwjs.github.io">\n <Icon type=\'user\' /> \n 16 Friends\n </a>\n)\n\nfunction Demo() {\n return <Card\n active\n title="Card\u6807\u9898"\n footer={footer}\n style={{ width: 240 }} \n bodyStyle={{ padding: 0 }}\n >\n <div>\n <img alt="example" width="100%" src="https://avatars1.githubusercontent.com/u/1680273?v=4" />\n </div>\n <div style={{ padding: `10px 16px` }}>\n <h3 style={{margin:0}}>\u6211\u7231\u6f02\u4eae\u59b9\u59b9</h3>\n <p style={{margin:0}}><a href="https://uiwjs.github.io">https://uiwjs.github.io</a></p>\n </div>\n </Card>\n}\nexport default Demo\n```\n\n## API\n\n\| \u53c2\u6570 \| \u8bf4\u660e \| \u7c7b\u578b \| \u9ed8\u8ba4\u503c \|\n\|--------- \|-------- \|--------- \|-------- \|\n\| title \| \u5361\u7247\u6807\u9898 \| String/ReactNode \| - \|\n\| footer \| \u9875\u811a\u5185\u5bb9\u7684\u7b80\u5199 \| String/ReactNode \| - \|\n\| extra \| \u5361\u7247\u53f3\u4e0a\u89d2\u7684\u64cd\u4f5c\u533a\u57df \| String/ReactNode \| - \|\n\| bordered \| \u662f\u5426\u663e\u793a\u8fb9\u6846 \| Boolean \| `true` \|\n\| active \| \u5c55\u793a\u9f20\u6807\u7ecf\u8fc7\u7684\u6837\u5f0f\u3002 \| Boolean \| `false` \|\n\| noHover \| \u53d6\u6d88\u9f20\u6807\u79fb\u8fc7\u65f6\u8fb9\u6846\u9634\u5f71 \| Boolean \| `false` \|\n\| bodyStyle \| \u8bbe\u7f6e `body` \u7684\u6837\u5f0f \| Object \| - \|\n\| bodyClassName \| \u8bbe\u7f6e `body` \u7684 `className` \| String \| - \|'}}}]);
2	- //# sourceMappingURL=8110.c0ad97fe.chunk.js.map

package/web/static/js/8415.1da9a8c6.chunk.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- "use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite\|\|[]).push([[8415],{8415:function(e,t,n){n.r(t),t.default={components:{20:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);function a(e,t){return function(e){if(Array.isArray(e))return e}(e)\|\|function(e,t){var n=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]\|\|e["@@iterator"];if(null==n)return;var r,a,l=[],o=!0,u=!1;try{for(n=n.call(e);!(o=(r=n.next()).done)&&(l.push(r.value),!t\|\|l.length!==t);o=!0);}catch(i){u=!0,a=i}finally{try{o\|\|null==n.return\|\|n.return()}finally{if(u)throw a}}return l}(e,t)\|\|function(e,t){if(!e)return;if("string"===typeof e)return l(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n\|\|"Set"===n)return Array.from(e);if("Arguments"===n\|\|/^(?:Ui\|I)nt(?:8\|16\|32)(?:Clamped)?Array$/.test(n))return l(e,t)}(e,t)\|\|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,t){(null==t\|\|t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}return function(){var e=a(t.default.useState(20),2),n=e[0],l=e[1],o=a(t.default.useState(-5),2),u=o[0],i=o[1],s=a(t.default.useState([10,50]),2),c=s[0],f=s[1];return t.default.createElement("div",null,t.default.createElement(r.Slider,{value:n,style:{maxWidth:360},onChange:function(e){return l(e)}}),t.default.createElement("div",null,"\u8bbe\u7f6e progress \u503c\u4e3a ",t.default.createElement("b",null,'"false"')," \u4e0d\u663e\u793a\u8fdb\u5ea6\u6761"),t.default.createElement(r.Slider,{progress:!1,value:n,style:{maxWidth:360,marginTop:30},onChange:function(e){return l(e)}}),t.default.createElement("div",null,"\u8bbe\u7f6e progress \u503c\u4e3a ",t.default.createElement("b",null,'"#dc3545"')," \u8fd9\u662f\u4e00\u4e2a\u989c\u8272\u503c\uff0c\u8bbe\u7f6e\u8fdb\u5ea6\u6761\u989c\u8272"),t.default.createElement(r.Slider,{progress:"#dc3545",value:n,style:{maxWidth:360,marginTop:30},onChange:function(e){return l(e)}}),t.default.createElement("div",null,"\u5f53\u524d\u503c\uff1a",t.default.createElement("b",null,n)),t.default.createElement(r.Divider,null),t.default.createElement(r.Slider,{min:-10,max:30,value:u,style:{maxWidth:260},onChange:function(e){return i(e)}}),t.default.createElement("div",null,"\u53ef\u9009 -10~30\u503c\u8303\u56f4\uff1a",t.default.createElement("b",null,u)),t.default.createElement(r.Divider,null),t.default.createElement(r.Slider,{value:c,style:{maxWidth:260},onChange:function(e){return f(e)}}),t.default.createElement("div",null,"\u53d6\u503c\u8303\u56f4\uff1a",t.default.createElement("b",null,c[0]," ~ ",c[1])))}}(),76:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);return function(){return t.default.createElement("div",null,t.default.createElement(r.Form,{onSubmit:function(e){var t=e.initial,n=e.current;n.age===t.age?r.Notify.error({title:"\u63d0\u4ea4\u5931\u8d25\uff01",description:"\u8868\u5355\u63d0\u4ea4\u5e74\u9f84\u5931\u8d25\uff0c\u5e74\u9f84\u4e3a\uff1a".concat(n.age,"\uff0c\u4e0e\u521d\u59cb\u5316\u503c\u662f\u4e00\u6837\u6ef4\uff01")}):r.Notify.success({title:"\u63d0\u4ea4\u6210\u529f\uff01",description:"\u8868\u5355\u63d0\u4ea4\u5e74\u9f84\u6210\u529f\uff0c\u5e74\u9f84\u4e3a\uff1a".concat(n.age,"\uff0c\u5c06\u81ea\u52a8\u586b\u5145\u521d\u59cb\u5316\u503c\uff01")})},fields:{age:{initialValue:0,inline:!0,label:"\u5e74\u9f84",help:"\u503c\u5fc5\u987b\u5927\u4e8e 10",validator:function(e){return e<10?"\u5fc5\u586b\u9009\u9879\uff01":null},children:t.default.createElement(r.Slider,null)}}},(function(e){var n=e.fields,a=e.state,l=e.canSubmit;return console.log("state:",a),t.default.createElement("div",null,t.default.createElement(r.Row,{gutter:10},t.default.createElement(r.Col,{style:{maxWidth:300}},n.age),t.default.createElement(r.Col,null,a.current.age)),t.default.createElement(r.Row,null,t.default.createElement(r.Col,{fixed:!0},t.default.createElement(r.Button,{disabled:!l(),type:"primary",htmlType:"submit"},"\u63d0\u4ea4"))),t.default.createElement(r.Row,null,t.default.createElement(r.Col,null,t.default.createElement("pre",{style:{padding:10,marginTop:10}},JSON.stringify(a.current,null,2)))))})))}}(),140:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);return function(){return t.default.createElement("div",null,t.default.createElement("div",null,"\u8bbe\u7f6e tooltip \u503c\u4e3a ",t.default.createElement("b",null,"true"),"\uff0c\u63d0\u793a\u5c06\u59cb\u7ec8\u663e\u793a\u3002"),t.default.createElement(r.Slider,{value:25,style:{maxWidth:260},tooltip:!0}),t.default.createElement(r.Divider,null),t.default.createElement("div",null,"\u8bbe\u7f6e tooltip \u503c\u4e3a ",t.default.createElement("b",null,"null"),"\uff0c\u63d0\u793a\u5c06\u59cb\u7ec8\u4e0d\u663e\u793a\u3002"),t.default.createElement(r.Slider,{value:25,style:{maxWidth:260},tooltip:null}),t.default.createElement(r.Divider,null),t.default.createElement("div",null,"\u8bbe\u7f6e tooltip \u503c\u4e3a ",t.default.createElement("b",null,"false"),"\uff0c\u9f20\u6807\u7ecf\u8fc7\u663e\u793a\u63d0\u793a\u3002"),t.default.createElement(r.Slider,{value:25,style:{maxWidth:260},tooltip:!1}))}}(),165:function(){function e(t){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(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},a=n(2814);function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function o(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function u(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t){return i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},i(e,t)}function s(e){var t=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 n,r=f(e);if(t){var a=f(this).constructor;n=Reflect.construct(r,arguments,a)}else n=r.apply(this,arguments);return c(this,n)}}function c(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function f(e){return f=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},f(e)}return function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&i(e,t)}(d,e);var t,n,c,f=s(d);function d(e){var t;return o(this,d),(t=f.call(this,e)).state={value:20,value2:1.5,value3:20,value4:[10,40]},t}return t=d,(n=[{key:"render",value:function(){var e,t=this;return r.default.createElement("div",null,r.default.createElement("div",null,"\u523b\u5ea6 ",r.default.createElement("b",null,"step=10")," \u5f53\u524d\u503c\uff1a",r.default.createElement("b",null,this.state.value)),r.default.createElement(a.Slider,{step:10,max:200,dots:!0,value:this.state.value,style:{maxWidth:460},onChange:function(e){t.setState({value:e})}}),r.default.createElement(a.Divider,null),r.default.createElement("div",null,"\u523b\u5ea6 ",r.default.createElement("b",null,"step=0.5")," \u5f53\u524d\u503c\uff1a",r.default.createElement("b",null,this.state.value2)),r.default.createElement(a.Slider,{min:0,max:2,step:.5,dots:!0,value:this.state.value2,style:{maxWidth:460},onChange:function(e){t.setState({value2:e})}}),r.default.createElement(a.Divider,null),r.default.createElement("div",null,"\u523b\u5ea6 ",r.default.createElement("b",null,"step=3"),"\uff0c\u8bbe\u7f6e ",r.default.createElement("b",null,"dots=false")," \u4e0d\u663e\u793a\u523b\u5ea6 \u5f53\u524d\u503c\uff1a",r.default.createElement("b",null,this.state.value3)),r.default.createElement(a.Slider,(l(e={value:26,min:20,max:40,step:2},"value",this.state.value3),l(e,"style",{maxWidth:260}),l(e,"onChange",(function(e){t.setState({value3:e})})),e)),r.default.createElement(a.Divider,null),r.default.createElement("div",null,"\u503c ",r.default.createElement("b",null,"value=[10, 40]")," \uff0c\u5fc5\u987b\u8bbe\u7f6e",r.default.createElement("b",null,"range=true"),"\uff0c\u53d6\u503c\u8303\u56f4\uff1a",r.default.createElement("b",null,this.state.value4[0]," ~ ",this.state.value4[1])),r.default.createElement(a.Slider,{value:this.state.value4,style:{maxWidth:260},onChange:function(e){t.setState({value4:e})}}))}}])&&u(t.prototype,n),c&&u(t,c),Object.defineProperty(t,"prototype",{writable:!1}),d}(r.default.Component)}(),235:function(){function e(t){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(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},a=n(2814);function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function o(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function u(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t){return i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},i(e,t)}function s(e){var t=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 n,r=f(e);if(t){var a=f(this).constructor;n=Reflect.construct(r,arguments,a)}else n=r.apply(this,arguments);return c(this,n)}}function c(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function f(e){return f=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},f(e)}return function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&i(e,t)}(d,e);var t,n,c,f=s(d);function d(e){var t;return o(this,d),(t=f.call(this,e)).state={value:20,value2:1.5,value3:20},t}return t=d,(n=[{key:"render",value:function(){var e,t,n=this;return r.default.createElement("div",null,r.default.createElement("div",null,"\u523b\u5ea6 ",r.default.createElement("b",null,"step=2")," \u5f53\u524d\u503c\uff1a",r.default.createElement("b",null,this.state.value)),r.default.createElement(a.Slider,{min:-10,max:30,step:2,dots:!0,value:this.state.value,marks:(e={},l(e,-10,"-10\xb0C"),l(e,-2,"-2\xb0C"),l(e,0,{style:{color:"#af00ff"}}),l(e,30,{style:{color:"#ff7c00"},label:r.default.createElement("strong",null,"30\xb0C")}),e),renderMarks:function(e){return"".concat(e,"\xb0C")},onChange:function(e){n.setState({value:e})}}),r.default.createElement("div",null,"\u523b\u5ea6 ",r.default.createElement("b",null,"step=0.5")," \u5f53\u524d\u503c\uff1a",r.default.createElement("b",null,this.state.value2)),r.default.createElement(a.Slider,{min:0,max:2,step:.5,dots:!0,marks:!0,value:this.state.value2,style:{maxWidth:460},onChange:function(e){n.setState({value2:e})}}),r.default.createElement("div",null,"\u523b\u5ea6 ",r.default.createElement("b",null,"step=3")," \u5f53\u524d\u503c\uff1a",r.default.createElement("b",null,this.state.value3)),r.default.createElement(a.Slider,(l(t={value:26,min:20,max:44,step:2,dots:!0,marks:!0},"value",this.state.value3),l(t,"style",{maxWidth:260}),l(t,"onChange",(function(e){console.log("value5:",e),n.setState({value3:e})})),t)))}}])&&u(t.prototype,n),c&&u(t,c),Object.defineProperty(t,"prototype",{writable:!1}),d}(r.default.Component)}(),311:function(){function e(t){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(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},a=n(2814);function l(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function o(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function u(e,t){return u=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},u(e,t)}function i(e){var t=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 n,r=c(e);if(t){var a=c(this).constructor;n=Reflect.construct(r,arguments,a)}else n=r.apply(this,arguments);return s(this,n)}}function s(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function c(e){return c=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},c(e)}var f=function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&u(e,t)}(f,e);var t,n,s,c=i(f);function f(){return l(this,f),c.apply(this,arguments)}return t=f,(n=[{key:"render",value:function(){return r.default.createElement("div",null,r.default.createElement(a.Slider,{value:25,disabled:!0,style:{maxWidth:260}}),r.default.createElement(a.Divider,null),r.default.createElement(a.Slider,{step:10,disabled:!0,dots:!0,value:50,style:{maxWidth:260}}),r.default.createElement(a.Divider,null),r.default.createElement(a.Slider,{disabled:!0,step:2,value:26,min:20,max:44,dots:!0,marks:!0}))}}])&&o(t.prototype,n),s&&o(t,s),Object.defineProperty(t,"prototype",{writable:!1}),f}(r.default.Component);return f}(),339:function(){function e(t){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(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},a=n(2814);function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function o(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function u(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t){return i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},i(e,t)}function s(e){var t=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 n,r=f(e);if(t){var a=f(this).constructor;n=Reflect.construct(r,arguments,a)}else n=r.apply(this,arguments);return c(this,n)}}function c(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function f(e){return f=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},f(e)}var d=function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&i(e,t)}(d,e);var t,n,c,f=s(d);function d(){return o(this,d),f.apply(this,arguments)}return t=d,(n=[{key:"render",value:function(){var e;return r.default.createElement(a.Row,null,r.default.createElement(a.Col,{fixed:!0,style:{width:70}},r.default.createElement(a.Slider,{vertical:!0,min:-10,max:30,step:2,dots:!0,value:20,marks:(e={},l(e,-10,"-10\xb0C"),l(e,-2,"-2\xb0C"),l(e,0," "),l(e,2,{style:{color:"#af00ff"}}),l(e,30,{style:{color:"#ff7c00"},label:r.default.createElement("strong",null,"30\xb0C")}),e),style:{height:260},renderMarks:function(e){return"".concat(e,"\xb0C")}})),r.default.createElement(a.Col,{fixed:!0},r.default.createElement(a.Slider,{vertical:!0,value:25,style:{height:260}})),r.default.createElement(a.Col,{fixed:!0},r.default.createElement(a.Slider,{vertical:!0,value:62,progress:!1,tooltip:!0,style:{height:260}})),r.default.createElement(a.Col,{fixed:!0},r.default.createElement(a.Slider,{vertical:!0,value:50,step:10,dots:!0,style:{height:260}})),r.default.createElement(a.Col,{fixed:!0},r.default.createElement(a.Slider,{vertical:!0,step:2,value:[26,40],min:20,max:44,dots:!0,marks:!0,style:{height:260}})))}}])&&u(t.prototype,n),c&&u(t,c),Object.defineProperty(t,"prototype",{writable:!1}),d}(r.default.Component);return d}()},data:{20:{name:20,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\nfunction Demo() {\n var _React$useState = _react["default"].useState(20),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n value = _React$useState2[0],\n setValue = _React$useState2[1];\n\n var _React$useState3 = _react["default"].useState(-5),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n value2 = _React$useState4[0],\n setValue2 = _React$useState4[1];\n\n var _React$useState5 = _react["default"].useState([10, 50]),\n _React$useState6 = _slicedToArray(_React$useState5, 2),\n value3 = _React$useState6[0],\n setValue3 = _React$useState6[1];\n\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n value: value,\n style: {\n maxWidth: 360\n },\n onChange: function onChange(value) {\n return setValue(value);\n }\n }), /#__PURE__/_react["default"].createElement("div", null, "\\u8BBE\\u7F6E progress \\u503C\\u4E3A ", /#__PURE__/_react["default"].createElement("b", null, "\\"false\\""), " \\u4E0D\\u663E\\u793A\\u8FDB\\u5EA6\\u6761"), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n progress: false,\n value: value,\n style: {\n maxWidth: 360,\n marginTop: 30\n },\n onChange: function onChange(value) {\n return setValue(value);\n }\n }), /#__PURE__/_react["default"].createElement("div", null, "\\u8BBE\\u7F6E progress \\u503C\\u4E3A ", /#__PURE__/_react["default"].createElement("b", null, "\\"#dc3545\\""), " \\u8FD9\\u662F\\u4E00\\u4E2A\\u989C\\u8272\\u503C\\uFF0C\\u8BBE\\u7F6E\\u8FDB\\u5EA6\\u6761\\u989C\\u8272"), /#__PURE__/_react["default"].createElement(_uiw.Slider // progress={false}\n , {\n progress: "#dc3545",\n value: value,\n style: {\n maxWidth: 360,\n marginTop: 30\n },\n onChange: function onChange(value) {\n return setValue(value);\n }\n }), /#__PURE__/_react["default"].createElement("div", null, "\\u5F53\\u524D\\u503C\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, value)), /#__PURE__/_react["default"].createElement(_uiw.Divider, null), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n min: -10,\n max: 30,\n value: value2,\n style: {\n maxWidth: 260\n },\n onChange: function onChange(val) {\n return setValue2(val);\n }\n }), /#__PURE__/_react["default"].createElement("div", null, "\\u53EF\\u9009 -10~30\\u503C\\u8303\\u56F4\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, value2)), /#__PURE__/_react["default"].createElement(_uiw.Divider, null), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n value: value3,\n style: {\n maxWidth: 260\n },\n onChange: function onChange(val) {\n return setValue3(val);\n }\n }), /#__PURE__/_react["default"].createElement("div", null, "\\u53D6\\u503C\\u8303\\u56F4\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, value3[0], " ~ ", value3[1])));\n}\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Slider, Divider } from \'uiw\';\n\nfunction Demo() {\n const [value, setValue] = React.useState(20);\n const [value2, setValue2] = React.useState(-5);\n const [value3, setValue3] = React.useState([10, 50]);\n return (\n <div>\n <Slider\n value={value}\n style={{ maxWidth: 360 }}\n onChange={(value)=> setValue(value)}\n />\n <div>\u8bbe\u7f6e progress \u503c\u4e3a <b>"false"</b> \u4e0d\u663e\u793a\u8fdb\u5ea6\u6761</div>\n <Slider\n progress={false}\n value={value}\n style={{ maxWidth: 360, marginTop: 30 }}\n onChange={(value)=> setValue(value)}\n />\n <div>\u8bbe\u7f6e progress \u503c\u4e3a <b>"#dc3545"</b> \u8fd9\u662f\u4e00\u4e2a\u989c\u8272\u503c\uff0c\u8bbe\u7f6e\u8fdb\u5ea6\u6761\u989c\u8272</div>\n <Slider\n // progress={false}\n progress="#dc3545"\n value={value}\n style={{ maxWidth: 360, marginTop: 30 }}\n onChange={(value)=> setValue(value)}\n />\n <div>\u5f53\u524d\u503c\uff1a<b>{value}</b></div>\n <Divider />\n <Slider\n min={-10}\n max={30}\n value={value2}\n style={{ maxWidth: 260 }}\n onChange={(val)=> setValue2(val)}\n />\n <div>\u53ef\u9009 -10~30\u503c\u8303\u56f4\uff1a<b>{value2}</b></div>\n <Divider />\n <Slider value={value3} style={{ maxWidth: 260 }}\n onChange={(val)=> setValue3(val)}\n />\n <div>\u53d6\u503c\u8303\u56f4\uff1a<b>{value3[0]} ~ {value3[1]}</b></div>\n </div>\n )\n}\n\nexport default Demo'},76:{name:76,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.Form, {\n onSubmit: function onSubmit(_ref) {\n var initial = _ref.initial,\n current = _ref.current;\n\n if (current.age === initial.age) {\n _uiw.Notify.error({\n title: \'\u63d0\u4ea4\u5931\u8d25\uff01\',\n description: "\\u8868\\u5355\\u63D0\\u4EA4\\u5E74\\u9F84\\u5931\\u8D25\\uFF0C\\u5E74\\u9F84\\u4E3A\\uFF1A".concat(current.age, "\\uFF0C\\u4E0E\\u521D\\u59CB\\u5316\\u503C\\u662F\\u4E00\\u6837\\u6EF4\\uFF01")\n });\n } else {\n _uiw.Notify.success({\n title: \'\u63d0\u4ea4\u6210\u529f\uff01\',\n description: "\\u8868\\u5355\\u63D0\\u4EA4\\u5E74\\u9F84\\u6210\\u529F\\uFF0C\\u5E74\\u9F84\\u4E3A\\uFF1A".concat(current.age, "\\uFF0C\\u5C06\\u81EA\\u52A8\\u586B\\u5145\\u521D\\u59CB\\u5316\\u503C\\uFF01")\n });\n }\n },\n fields: {\n age: {\n initialValue: 0,\n inline: true,\n label: \'\u5e74\u9f84\',\n help: \'\u503c\u5fc5\u987b\u5927\u4e8e 10\',\n validator: function validator(value) {\n return value < 10 ? \'\u5fc5\u586b\u9009\u9879\uff01\' : null;\n },\n children: /#__PURE__/_react["default"].createElement(_uiw.Slider, null)\n }\n }\n }, function (_ref2) {\n var fields = _ref2.fields,\n state = _ref2.state,\n canSubmit = _ref2.canSubmit;\n console.log(\'state:\', state);\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Row, {\n gutter: 10\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n style: {\n maxWidth: 300\n }\n }, fields.age), /#__PURE__/_react["default"].createElement(_uiw.Col, null, state.current.age)), /#__PURE__/_react["default"].createElement(_uiw.Row, null, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n disabled: !canSubmit(),\n type: "primary",\n htmlType: "submit"\n }, "\\u63D0\\u4EA4"))), /#__PURE__/_react["default"].createElement(_uiw.Row, null, /#__PURE__/_react["default"].createElement(_uiw.Col, null, /#__PURE__/_react["default"].createElement("pre", {\n style: {\n padding: 10,\n marginTop: 10\n }\n }, JSON.stringify(state.current, null, 2)))));\n }));\n};\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Form, Row, Col, Slider, Button, Notify } from 'uiw';\n\nconst Demo = () => (\n <div>\n <Form\n onSubmit={({initial, current}) => {\n if(current.age === initial.age) {\n Notify.error({\n title: '\u63d0\u4ea4\u5931\u8d25\uff01',\n description: `\u8868\u5355\u63d0\u4ea4\u5e74\u9f84\u5931\u8d25\uff0c\u5e74\u9f84\u4e3a\uff1a${current.age}\uff0c\u4e0e\u521d\u59cb\u5316\u503c\u662f\u4e00\u6837\u6ef4\uff01`,\n });\n } else {\n Notify.success({\n title: '\u63d0\u4ea4\u6210\u529f\uff01',\n description: `\u8868\u5355\u63d0\u4ea4\u5e74\u9f84\u6210\u529f\uff0c\u5e74\u9f84\u4e3a\uff1a${current.age}\uff0c\u5c06\u81ea\u52a8\u586b\u5145\u521d\u59cb\u5316\u503c\uff01`,\n });\n }\n }}\n fields={{\n age: {\n initialValue: 0,\n inline: true,\n label: '\u5e74\u9f84',\n help: '\u503c\u5fc5\u987b\u5927\u4e8e 10',\n validator: (value) => value < 10 ? '\u5fc5\u586b\u9009\u9879\uff01' : null,\n children: <Slider />\n },\n }}\n >\n {({ fields, state, canSubmit }) => {\n console.log('state:', state)\n return (\n <div>\n <Row gutter={10}>\n <Col style={{ maxWidth: 300 }}>{fields.age}</Col>\n <Col>{state.current.age}</Col>\n </Row>\n <Row>\n <Col fixed>\n <Button disabled={!canSubmit()} type=\"primary\" htmlType=\"submit\">\u63d0\u4ea4</Button>\n </Col>\n </Row>\n <Row>\n <Col>\n <pre style={{ padding: 10, marginTop: 10 }}>\n {JSON.stringify(state.current, null, 2)}\n </pre>\n </Col>\n </Row>\n </div>\n )\n }}\n </Form>\n </div>\n)\nexport default Demo"},140:{name:140,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 Demo() {\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement("div", null, "\\u8BBE\\u7F6E tooltip \\u503C\\u4E3A ", /#__PURE__/_react["default"].createElement("b", null, "true"), "\\uFF0C\\u63D0\\u793A\\u5C06\\u59CB\\u7EC8\\u663E\\u793A\\u3002"), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n value: 25,\n style: {\n maxWidth: 260\n },\n tooltip: true\n }), /#__PURE__/_react["default"].createElement(_uiw.Divider, null), /#__PURE__/_react["default"].createElement("div", null, "\\u8BBE\\u7F6E tooltip \\u503C\\u4E3A ", /#__PURE__/_react["default"].createElement("b", null, "null"), "\\uFF0C\\u63D0\\u793A\\u5C06\\u59CB\\u7EC8\\u4E0D\\u663E\\u793A\\u3002"), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n value: 25,\n style: {\n maxWidth: 260\n },\n tooltip: null\n }), /#__PURE__/_react["default"].createElement(_uiw.Divider, null), /#__PURE__/_react["default"].createElement("div", null, "\\u8BBE\\u7F6E tooltip \\u503C\\u4E3A ", /#__PURE__/_react["default"].createElement("b", null, "false"), "\\uFF0C\\u9F20\\u6807\\u7ECF\\u8FC7\\u663E\\u793A\\u63D0\\u793A\\u3002"), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n value: 25,\n style: {\n maxWidth: 260\n },\n tooltip: false\n }));\n}\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Slider, Divider } from 'uiw';\n\nfunction Demo() {\n return (\n <div>\n <div>\u8bbe\u7f6e tooltip \u503c\u4e3a <b>true</b>\uff0c\u63d0\u793a\u5c06\u59cb\u7ec8\u663e\u793a\u3002</div>\n <Slider value={25} style={{ maxWidth: 260 }} tooltip />\n <Divider />\n <div>\u8bbe\u7f6e tooltip \u503c\u4e3a <b>null</b>\uff0c\u63d0\u793a\u5c06\u59cb\u7ec8\u4e0d\u663e\u793a\u3002</div>\n <Slider value={25} style={{ maxWidth: 260 }} tooltip={null} />\n <Divider />\n <div>\u8bbe\u7f6e tooltip \u503c\u4e3a <b>false</b>\uff0c\u9f20\u6807\u7ecf\u8fc7\u663e\u793a\u63d0\u793a\u3002</div>\n <Slider value={25} style={{ maxWidth: 260 }} tooltip={false} />\n </div>\n )\n}\nexport default Demo"},165:{name:165,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 _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 value: 20,\n value2: 1.5,\n value3: 20,\n value4: [10, 40]\n };\n return _this;\n }\n\n _createClass(Demo, [{\n key: "render",\n value: function render() {\n var _this2 = this,\n _React$createElement;\n\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement("div", null, "\\u523B\\u5EA6 ", /#__PURE__/_react["default"].createElement("b", null, "step=10"), " \\u5F53\\u524D\\u503C\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, this.state.value)), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n step: 10,\n max: 200,\n dots: true,\n value: this.state.value,\n style: {\n maxWidth: 460\n },\n onChange: function onChange(value) {\n _this2.setState({\n value: value\n });\n }\n }), /#__PURE__/_react["default"].createElement(_uiw.Divider, null), /#__PURE__/_react["default"].createElement("div", null, "\\u523B\\u5EA6 ", /#__PURE__/_react["default"].createElement("b", null, "step=0.5"), " \\u5F53\\u524D\\u503C\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, this.state.value2)), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n min: 0,\n max: 2,\n step: 0.5,\n dots: true,\n value: this.state.value2,\n style: {\n maxWidth: 460\n },\n onChange: function onChange(value2) {\n _this2.setState({\n value2: value2\n });\n }\n }), /#__PURE__/_react["default"].createElement(_uiw.Divider, null), /#__PURE__/_react["default"].createElement("div", null, "\\u523B\\u5EA6 ", /#__PURE__/_react["default"].createElement("b", null, "step=3"), "\\uFF0C\\u8BBE\\u7F6E ", /#__PURE__/_react["default"].createElement("b", null, "dots=false"), " \\u4E0D\\u663E\\u793A\\u523B\\u5EA6 \\u5F53\\u524D\\u503C\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, this.state.value3)), /#__PURE__/_react["default"].createElement(_uiw.Slider, (_React$createElement = {\n value: 26,\n min: 20,\n max: 40,\n step: 2\n }, _defineProperty(_React$createElement, "value", this.state.value3), _defineProperty(_React$createElement, "style", {\n maxWidth: 260\n }), _defineProperty(_React$createElement, "onChange", function onChange(value3) {\n _this2.setState({\n value3: value3\n });\n }), _React$createElement)), /#__PURE__/_react["default"].createElement(_uiw.Divider, null), /#__PURE__/_react["default"].createElement("div", null, "\\u503C ", /#__PURE__/_react["default"].createElement("b", null, "value=[10, 40]"), " \\uFF0C\\u5FC5\\u987B\\u8BBE\\u7F6E", /#__PURE__/_react["default"].createElement("b", null, "range=true"), "\\uFF0C\\u53D6\\u503C\\u8303\\u56F4\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, this.state.value4[0], " ~ ", this.state.value4[1])), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n value: this.state.value4,\n style: {\n maxWidth: 260\n },\n onChange: function onChange(value4) {\n _this2.setState({\n value4: value4\n });\n }\n }));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Slider, Divider} from 'uiw';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n value: 20,\n value2: 1.5,\n value3: 20,\n value4: [10, 40],\n };\n }\n render() {\n return (\n <div>\n <div>\u523b\u5ea6 <b>step=10</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value}</b></div>\n <Slider\n step={10}\n max={200}\n dots\n value={this.state.value}\n style={{ maxWidth: 460 }}\n onChange={(value)=> {\n this.setState({ value });\n }}\n />\n <Divider />\n <div>\u523b\u5ea6 <b>step=0.5</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value2}</b></div>\n <Slider\n min={0}\n max={2}\n step={0.5}\n dots\n value={this.state.value2}\n style={{ maxWidth: 460 }}\n onChange={(value2)=> {\n this.setState({ value2 });\n }}\n />\n <Divider />\n <div>\u523b\u5ea6 <b>step=3</b>\uff0c\u8bbe\u7f6e <b>dots=false</b> \u4e0d\u663e\u793a\u523b\u5ea6 \u5f53\u524d\u503c\uff1a<b>{this.state.value3}</b></div>\n <Slider\n value={26}\n min={20}\n max={40}\n step={2}\n value={this.state.value3}\n style={{ maxWidth: 260 }}\n onChange={(value3)=> {\n this.setState({ value3 });\n }}\n />\n <Divider />\n <div>\u503c <b>value=[10, 40]</b> \uff0c\u5fc5\u987b\u8bbe\u7f6e<b>range=true</b>\uff0c\u53d6\u503c\u8303\u56f4\uff1a<b>{this.state.value4[0]} ~ {this.state.value4[1]}</b></div>\n <Slider value={this.state.value4} style={{ maxWidth: 260 }}\n onChange={(value4)=> {\n this.setState({ value4 });\n }}\n />\n </div>\n )\n }\n}\nexport default Demo"},235:{name:235,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 _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 value: 20,\n value2: 1.5,\n value3: 20\n };\n return _this;\n }\n\n _createClass(Demo, [{\n key: "render",\n value: function render() {\n var _ref,\n _this2 = this,\n _React$createElement;\n\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement("div", null, "\\u523B\\u5EA6 ", /#__PURE__/_react["default"].createElement("b", null, "step=2"), " \\u5F53\\u524D\\u503C\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, this.state.value)), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n min: -10,\n max: 30,\n step: 2,\n dots: true,\n value: this.state.value,\n marks: (_ref = {}, _defineProperty(_ref, -10, \'-10\xb0C\'), _defineProperty(_ref, -2, \'-2\xb0C\'), _defineProperty(_ref, 0, {\n style: {\n color: \'#af00ff\'\n }\n }), _defineProperty(_ref, 30, {\n style: {\n color: \'#ff7c00\'\n },\n label: /#__PURE__/_react["default"].createElement("strong", null, "30\\xB0C")\n }), _ref),\n renderMarks: function renderMarks(mark) {\n return "".concat(mark, "\\xB0C");\n },\n onChange: function onChange(value) {\n _this2.setState({\n value: value\n });\n }\n }), /#__PURE__/_react["default"].createElement("div", null, "\\u523B\\u5EA6 ", /#__PURE__/_react["default"].createElement("b", null, "step=0.5"), " \\u5F53\\u524D\\u503C\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, this.state.value2)), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n min: 0,\n max: 2,\n step: 0.5,\n dots: true,\n marks: true,\n value: this.state.value2,\n style: {\n maxWidth: 460\n },\n onChange: function onChange(value2) {\n _this2.setState({\n value2: value2\n });\n }\n }), /#__PURE__/_react["default"].createElement("div", null, "\\u523B\\u5EA6 ", /#__PURE__/_react["default"].createElement("b", null, "step=3"), " \\u5F53\\u524D\\u503C\\uFF1A", /#__PURE__/_react["default"].createElement("b", null, this.state.value3)), /#__PURE__/_react["default"].createElement(_uiw.Slider, (_React$createElement = {\n value: 26,\n min: 20,\n max: 44,\n step: 2,\n dots: true,\n marks: true\n }, _defineProperty(_React$createElement, "value", this.state.value3), _defineProperty(_React$createElement, "style", {\n maxWidth: 260\n }), _defineProperty(_React$createElement, "onChange", function onChange(value3) {\n console.log(\'value5:\', value3);\n\n _this2.setState({\n value3: value3\n });\n }), _React$createElement)));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Slider, Divider} from 'uiw';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n value: 20,\n value2: 1.5,\n value3: 20,\n };\n }\n render() {\n return (\n <div>\n <div>\u523b\u5ea6 <b>step=2</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value}</b></div>\n <Slider\n min={-10}\n max={30}\n step={2}\n dots\n value={this.state.value}\n marks={{\n [-10]: '-10\xb0C',\n [-2]: '-2\xb0C',\n 0: {\n style: { color: '#af00ff' },\n },\n 30: {\n style: { color: '#ff7c00' },\n label: <strong>30\xb0C</strong>,\n }\n }}\n renderMarks={(mark) => `${mark}\xb0C`}\n onChange={(value)=> {\n this.setState({ value });\n }}\n />\n <div>\u523b\u5ea6 <b>step=0.5</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value2}</b></div>\n <Slider\n min={0}\n max={2}\n step={0.5}\n dots\n marks\n value={this.state.value2}\n style={{ maxWidth: 460 }}\n onChange={(value2)=> {\n this.setState({ value2 });\n }}\n />\n <div>\u523b\u5ea6 <b>step=3</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value3}</b></div>\n <Slider\n value={26}\n min={20}\n max={44}\n step={2}\n dots\n marks\n value={this.state.value3}\n style={{ maxWidth: 260 }}\n onChange={(value3)=> {\n console.log('value5:', value3);\n this.setState({ value3 });\n }}\n />\n </div>\n )\n }\n}\nexport default Demo"},311:{name:311,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 _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() {\n _classCallCheck(this, Demo);\n\n return _super.apply(this, arguments);\n }\n\n _createClass(Demo, [{\n key: "render",\n value: function render() {\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n value: 25,\n disabled: true,\n style: {\n maxWidth: 260\n }\n }), /#__PURE__/_react["default"].createElement(_uiw.Divider, null), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n step: 10,\n disabled: true,\n dots: true,\n value: 50,\n style: {\n maxWidth: 260\n }\n }), /#__PURE__/_react["default"].createElement(_uiw.Divider, null), /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n disabled: true,\n step: 2,\n value: 26,\n min: 20,\n max: 44,\n dots: true,\n marks: true\n }));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Slider, Divider} from 'uiw';\n\nclass Demo extends React.Component {\n render() {\n return (\n <div>\n <Slider value={25} disabled style={{ maxWidth: 260 }} />\n <Divider />\n <Slider\n step={10}\n disabled\n dots\n value={50}\n style={{ maxWidth: 260 }}\n />\n <Divider />\n <Slider disabled step={2} value={26} min={20} max={44} dots marks />\n </div>\n )\n }\n}\nexport default Demo"},339:{name:339,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 _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() {\n _classCallCheck(this, Demo);\n\n return _super.apply(this, arguments);\n }\n\n _createClass(Demo, [{\n key: "render",\n value: function render() {\n var _ref;\n\n return /#__PURE__/_react["default"].createElement(_uiw.Row, null, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true,\n style: {\n width: 70\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n vertical: true,\n min: -10,\n max: 30,\n step: 2,\n dots: true,\n value: 20,\n marks: (_ref = {}, _defineProperty(_ref, -10, \'-10\xb0C\'), _defineProperty(_ref, -2, \'-2\xb0C\'), _defineProperty(_ref, 0, \' \'), _defineProperty(_ref, 2, {\n style: {\n color: \'#af00ff\'\n }\n }), _defineProperty(_ref, 30, {\n style: {\n color: \'#ff7c00\'\n },\n label: /#__PURE__/_react["default"].createElement("strong", null, "30\\xB0C")\n }), _ref),\n style: {\n height: 260\n },\n renderMarks: function renderMarks(mark) {\n return "".concat(mark, "\\xB0C");\n }\n })), /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n vertical: true,\n value: 25,\n style: {\n height: 260\n }\n })), /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n vertical: true,\n value: 62,\n progress: false,\n tooltip: true,\n style: {\n height: 260\n }\n })), /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n vertical: true,\n value: 50,\n step: 10,\n dots: true,\n style: {\n height: 260\n }\n })), /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Slider, {\n vertical: true,\n step: 2,\n value: [26, 40],\n min: 20,\n max: 44,\n dots: true,\n marks: true,\n style: {\n height: 260\n }\n })));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Row, Col, Slider } from 'uiw';\n\nclass Demo extends React.Component {\n render() {\n return (\n <Row>\n <Col fixed style={{ width: 70 }}>\n <Slider\n vertical\n min={-10}\n max={30}\n step={2}\n dots\n value={20}\n marks={{\n [-10]: '-10\xb0C',\n [-2]: '-2\xb0C',\n 0: ' ',\n 2: {\n style: { color: '#af00ff' },\n },\n 30: {\n style: { color: '#ff7c00' },\n label: <strong>30\xb0C</strong>,\n }\n }}\n style={{ height: 260 }}\n renderMarks={(mark) => `${mark}\xb0C`}\n />\n </Col>\n <Col fixed>\n <Slider vertical value={25} style={{ height: 260 }} />\n </Col>\n <Col fixed>\n <Slider vertical value={62} progress={false} tooltip style={{ height: 260 }} />\n </Col>\n <Col fixed>\n <Slider vertical value={50} step={10} dots style={{ height: 260 }} />\n </Col>\n <Col fixed>\n <Slider vertical step={2} value={[26, 40]} min={20} max={44} dots marks style={{ height: 260 }} />\n </Col>\n </Row>\n );\n }\n}\nexport default Demo"}},source:"Slider \u6ed1\u5757\u8f93\u5165\u6761\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-slider/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-slider.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-slider)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-slider.svg?label=@uiw/react-slider)](https://npmjs.com/@uiw/react-slider)\n\n\u901a\u8fc7\u62d6\u52a8\u6ed1\u5757\u5728\u4e00\u4e2a\u56fa\u5b9a\u533a\u95f4\u5185\u8fdb\u884c\u9009\u62e9\uff0c\u6548\u679c\u6bd4 [`input`](https://www.w3.org/wiki/HTML/Elements/input/range) \u7c7b\u578b\u4e3a [`range`](https://www.w3.org/wiki/HTML/Elements/input/range) \u7684\u529f\u80fd\u4e30\u5bcc\u3002\n\n```jsx\nimport { Slider } from 'uiw';\n// or\nimport Slider from '@uiw/react-slider';\n```\n\n### \u57fa\u672c\u7528\u6cd5\n\n\u6309\u94ae\u6837\u5f0f\u7684\u5355\u9009\u7ec4\u5408\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Slider, Divider } from 'uiw';\n\nfunction Demo() {\n const [value, setValue] = React.useState(20);\n const [value2, setValue2] = React.useState(-5);\n const [value3, setValue3] = React.useState([10, 50]);\n return (\n <div>\n <Slider\n value={value}\n style={{ maxWidth: 360 }}\n onChange={(value)=> setValue(value)}\n />\n <div>\u8bbe\u7f6e progress \u503c\u4e3a <b>\"false\"</b> \u4e0d\u663e\u793a\u8fdb\u5ea6\u6761</div>\n <Slider\n progress={false}\n value={value}\n style={{ maxWidth: 360, marginTop: 30 }}\n onChange={(value)=> setValue(value)}\n />\n <div>\u8bbe\u7f6e progress \u503c\u4e3a <b>\"#dc3545\"</b> \u8fd9\u662f\u4e00\u4e2a\u989c\u8272\u503c\uff0c\u8bbe\u7f6e\u8fdb\u5ea6\u6761\u989c\u8272</div>\n <Slider\n // progress={false}\n progress=\"#dc3545\"\n value={value}\n style={{ maxWidth: 360, marginTop: 30 }}\n onChange={(value)=> setValue(value)}\n />\n <div>\u5f53\u524d\u503c\uff1a<b>{value}</b></div>\n <Divider />\n <Slider\n min={-10}\n max={30}\n value={value2}\n style={{ maxWidth: 260 }}\n onChange={(val)=> setValue2(val)}\n />\n <div>\u53ef\u9009 -10~30\u503c\u8303\u56f4\uff1a<b>{value2}</b></div>\n <Divider />\n <Slider value={value3} style={{ maxWidth: 260 }}\n onChange={(val)=> setValue3(val)}\n />\n <div>\u53d6\u503c\u8303\u56f4\uff1a<b>{value3[0]} ~ {value3[1]}</b></div>\n </div>\n )\n}\n\nexport default Demo\n```\n\n### \u5728\u8868\u5355\u4e2d\u4f7f\u7528\n\n\u5728 [`<Form />`](#/components/form) \u8868\u5355\u4e2d\u5e94\u7528 [`<Slider />`](#/components/slider) \u7ec4\u4ef6\uff0c\u9700\u8981\u8bbe\u7f6e `initialValue` \u521d\u59cb\u503c\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Form, Row, Col, Slider, Button, Notify } from 'uiw';\n\nconst Demo = () => (\n <div>\n <Form\n onSubmit={({initial, current}) => {\n if(current.age === initial.age) {\n Notify.error({\n title: '\u63d0\u4ea4\u5931\u8d25\uff01',\n description: `\u8868\u5355\u63d0\u4ea4\u5e74\u9f84\u5931\u8d25\uff0c\u5e74\u9f84\u4e3a\uff1a${current.age}\uff0c\u4e0e\u521d\u59cb\u5316\u503c\u662f\u4e00\u6837\u6ef4\uff01`,\n });\n } else {\n Notify.success({\n title: '\u63d0\u4ea4\u6210\u529f\uff01',\n description: `\u8868\u5355\u63d0\u4ea4\u5e74\u9f84\u6210\u529f\uff0c\u5e74\u9f84\u4e3a\uff1a${current.age}\uff0c\u5c06\u81ea\u52a8\u586b\u5145\u521d\u59cb\u5316\u503c\uff01`,\n });\n }\n }}\n fields={{\n age: {\n initialValue: 0,\n inline: true,\n label: '\u5e74\u9f84',\n help: '\u503c\u5fc5\u987b\u5927\u4e8e 10',\n validator: (value) => value < 10 ? '\u5fc5\u586b\u9009\u9879\uff01' : null,\n children: <Slider />\n },\n }}\n >\n {({ fields, state, canSubmit }) => {\n console.log('state:', state)\n return (\n <div>\n <Row gutter={10}>\n <Col style={{ maxWidth: 300 }}>{fields.age}</Col>\n <Col>{state.current.age}</Col>\n </Row>\n <Row>\n <Col fixed>\n <Button disabled={!canSubmit()} type=\"primary\" htmlType=\"submit\">\u63d0\u4ea4</Button>\n </Col>\n </Row>\n <Row>\n <Col>\n <pre style={{ padding: 10, marginTop: 10 }}>\n {JSON.stringify(state.current, null, 2)}\n </pre>\n </Col>\n </Row>\n </div>\n )\n }}\n </Form>\n </div>\n)\nexport default Demo\n```\n\n### \u63a7\u5236\u63d0\u793a\u663e\u793a\n\n\u901a\u8fc7\u8bbe\u7f6e `tooltip` \u7684\u503c\uff0c\u6765\u63a7\u5236\u63d0\u793a\u7684\u663e\u793a\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Slider, Divider } from 'uiw';\n\nfunction Demo() {\n return (\n <div>\n <div>\u8bbe\u7f6e tooltip \u503c\u4e3a <b>true</b>\uff0c\u63d0\u793a\u5c06\u59cb\u7ec8\u663e\u793a\u3002</div>\n <Slider value={25} style={{ maxWidth: 260 }} tooltip />\n <Divider />\n <div>\u8bbe\u7f6e tooltip \u503c\u4e3a <b>null</b>\uff0c\u63d0\u793a\u5c06\u59cb\u7ec8\u4e0d\u663e\u793a\u3002</div>\n <Slider value={25} style={{ maxWidth: 260 }} tooltip={null} />\n <Divider />\n <div>\u8bbe\u7f6e tooltip \u503c\u4e3a <b>false</b>\uff0c\u9f20\u6807\u7ecf\u8fc7\u663e\u793a\u63d0\u793a\u3002</div>\n <Slider value={25} style={{ maxWidth: 260 }} tooltip={false} />\n </div>\n )\n}\nexport default Demo\n```\n\n### \u523b\u5ea6\n\n\u901a\u8fc7 `step` \u8bbe\u7f6e\u6216\u8fd4\u56de\u6bcf\u6b21\u62d6\u52a8\u6ed1\u5757\u63a7\u4ef6\u65f6\u7684\u9012\u589e\u91cf\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Slider, Divider} from 'uiw';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n value: 20,\n value2: 1.5,\n value3: 20,\n value4: [10, 40],\n };\n }\n render() {\n return (\n <div>\n <div>\u523b\u5ea6 <b>step=10</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value}</b></div>\n <Slider\n step={10}\n max={200}\n dots\n value={this.state.value}\n style={{ maxWidth: 460 }}\n onChange={(value)=> {\n this.setState({ value });\n }}\n />\n <Divider />\n <div>\u523b\u5ea6 <b>step=0.5</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value2}</b></div>\n <Slider\n min={0}\n max={2}\n step={0.5}\n dots\n value={this.state.value2}\n style={{ maxWidth: 460 }}\n onChange={(value2)=> {\n this.setState({ value2 });\n }}\n />\n <Divider />\n <div>\u523b\u5ea6 <b>step=3</b>\uff0c\u8bbe\u7f6e <b>dots=false</b> \u4e0d\u663e\u793a\u523b\u5ea6 \u5f53\u524d\u503c\uff1a<b>{this.state.value3}</b></div>\n <Slider\n value={26}\n min={20}\n max={40}\n step={2}\n value={this.state.value3}\n style={{ maxWidth: 260 }}\n onChange={(value3)=> {\n this.setState({ value3 });\n }}\n />\n <Divider />\n <div>\u503c <b>value=[10, 40]</b> \uff0c\u5fc5\u987b\u8bbe\u7f6e<b>range=true</b>\uff0c\u53d6\u503c\u8303\u56f4\uff1a<b>{this.state.value4[0]} ~ {this.state.value4[1]}</b></div>\n <Slider value={this.state.value4} style={{ maxWidth: 260 }}\n onChange={(value4)=> {\n this.setState({ value4 });\n }}\n />\n </div>\n )\n }\n}\nexport default Demo\n```\n\n### \u6807\u8bb0\u523b\u5ea6\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Slider, Divider} from 'uiw';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n value: 20,\n value2: 1.5,\n value3: 20,\n };\n }\n render() {\n return (\n <div>\n <div>\u523b\u5ea6 <b>step=2</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value}</b></div>\n <Slider\n min={-10}\n max={30}\n step={2}\n dots\n value={this.state.value}\n marks={{\n [-10]: '-10\xb0C',\n [-2]: '-2\xb0C',\n 0: {\n style: { color: '#af00ff' },\n },\n 30: {\n style: { color: '#ff7c00' },\n label: <strong>30\xb0C</strong>,\n }\n }}\n renderMarks={(mark) => `${mark}\xb0C`}\n onChange={(value)=> {\n this.setState({ value });\n }}\n />\n <div>\u523b\u5ea6 <b>step=0.5</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value2}</b></div>\n <Slider\n min={0}\n max={2}\n step={0.5}\n dots\n marks\n value={this.state.value2}\n style={{ maxWidth: 460 }}\n onChange={(value2)=> {\n this.setState({ value2 });\n }}\n />\n <div>\u523b\u5ea6 <b>step=3</b> \u5f53\u524d\u503c\uff1a<b>{this.state.value3}</b></div>\n <Slider\n value={26}\n min={20}\n max={44}\n step={2}\n dots\n marks\n value={this.state.value3}\n style={{ maxWidth: 260 }}\n onChange={(value3)=> {\n console.log('value5:', value3);\n this.setState({ value3 });\n }}\n />\n </div>\n )\n }\n}\nexport default Demo\n```\n\n### \u7981\u7528\u6837\u5f0f\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Slider, Divider} from 'uiw';\n\nclass Demo extends React.Component {\n render() {\n return (\n <div>\n <Slider value={25} disabled style={{ maxWidth: 260 }} />\n <Divider />\n <Slider\n step={10}\n disabled\n dots\n value={50}\n style={{ maxWidth: 260 }}\n />\n <Divider />\n <Slider disabled step={2} value={26} min={20} max={44} dots marks />\n </div>\n )\n }\n}\nexport default Demo\n```\n\n### \u5782\u76f4\u65b9\u5411\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Row, Col, Slider } from 'uiw';\n\nclass Demo extends React.Component {\n render() {\n return (\n <Row>\n <Col fixed style={{ width: 70 }}>\n <Slider\n vertical\n min={-10}\n max={30}\n step={2}\n dots\n value={20}\n marks={{\n [-10]: '-10\xb0C',\n [-2]: '-2\xb0C',\n 0: ' ',\n 2: {\n style: { color: '#af00ff' },\n },\n 30: {\n style: { color: '#ff7c00' },\n label: <strong>30\xb0C</strong>,\n }\n }}\n style={{ height: 260 }}\n renderMarks={(mark) => `${mark}\xb0C`}\n />\n </Col>\n <Col fixed>\n <Slider vertical value={25} style={{ height: 260 }} />\n </Col>\n <Col fixed>\n <Slider vertical value={62} progress={false} tooltip style={{ height: 260 }} />\n </Col>\n <Col fixed>\n <Slider vertical value={50} step={10} dots style={{ height: 260 }} />\n </Col>\n <Col fixed>\n <Slider vertical step={2} value={[26, 40]} min={20} max={44} dots marks style={{ height: 260 }} />\n </Col>\n </Row>\n );\n }\n}\nexport default Demo\n```\n\n## Props\n\n\| \u53c2\u6570 \| \u8bf4\u660e \| \u7c7b\u578b \| \u9ed8\u8ba4\u503c \|\n\|--------- \|-------- \|--------- \|-------- \|\n\| value \| \u9009\u62e9\u7684\u6570\u503c\uff0c\u4e3a\u6570\u7ec4\u65f6\u5373\u53ef\u5f00\u542f\u8303\u56f4\u9009\u62e9\uff0c\u5e76\u4e14\u6307\u5b9a\u8303\u56f4\uff0c`@3.0.0+` \u901a\u8fc7\u5224\u65ad\u662f\u5426\u4e3a\u6570\u7ec4\uff0c\u5c55\u793a\u53cc\u6ed1\u5757 \| Number/Number[] \| `0` \|\n\| min \| \u6700\u5c0f\u503c \| Number \| `0` \|\n\| max \| \u6700\u5927\u503c \| Number \| `100` \|\n\| dots \| \u663e\u793a `step` \u95f4\u65ad\u70b9\uff0c\u5efa\u8bae\u5728 `step` \u95f4\u9694\u4e0d\u5bc6\u96c6\u65f6\u4f7f\u7528 \| Number \| `false` \|\n\| marks \| \u523b\u5ea6\u6807\u8bb0\uff0c`key` \u7684\u7c7b\u578b\u5fc5\u987b\u4e3a `number` \u4e14\u53d6\u503c\u5728\u95ed\u533a\u95f4 `min`, `max` \u5185\uff0c\u6bcf\u4e2a\u6807\u7b7e\u53ef\u4ee5\u5355\u72ec\u8bbe\u7f6e\u6837\u5f0f\uff0c\u5f53\u503c\u4e3a `Boolean` \u503c\u65f6\u8868\u793a\u662f\u5426\u663e\u793a\u523b\u5ea6 \| Object/Boolean \| - \|\n\| renderMarks \| \u523b\u5ea6\u6807\u8bb0\u6e32\u67d3 \| Function(mark) => String \| - \| \n\| step \| \u8bbe\u7f6e\u6216\u8fd4\u56de\u6bcf\u6b21\u62d6\u52a8\u6ed1\u5757\u63a7\u4ef6\u65f6\u7684\u9012\u589e\u91cf\uff0c\u89c4\u5b9a\u5408\u6cd5\u6570\u5b57\u95f4\u9694\uff08\u5982\u679c `step={3}`\uff0c\u5219\u5408\u6cd5\u6570\u5b57\u662f `0`,`3`,`6`\uff0c\u4ee5\u6b64\u7c7b\u63a8\uff09 \| Number \| `1` \|\n\| ~~range~~ \| \u26a0\ufe0f(`@3.0.0+` \u79fb\u9664\u4e86\u6b64\u5c5e\u6027) \u5f53 range \u4e3a true \u65f6\uff0c\u6e32\u67d3\u4e3a\u53cc\u6ed1\u5757, `2.x` \u7248\u672c\u652f\u6301\uff0c\u65b0\u7248\u672c\u901a\u8fc7\u5224\u65ad `value` \u662f\u5426\u4e3a\u6570\u7ec4\u6765\u652f\u6301\u53cc\u6ed1\u5757 \| Boolean \| `false` \|\n\| disabled \| \u662f\u5426\u7981\u7528 \| Boolean \| `false` \|\n\| progress \| \u663e\u793a\u6ed1\u52a8\u7684\u8fdb\u5ea6\u6761\uff0c\u8bbe\u4e3a `false` \u4e0d\u663e\u793a\u8fdb\u5ea6\u6761\uff0c\u8bbe\u4e3a\u4e3a\u989c\u8272\u503c\uff0c\u5c06\u8fdb\u5ea6\u6761\u8bbe\u4e3a\u4e0d\u540c\u7684\u989c\u8272 \| Boolean/String \| `true` \|\n\| vertical \| \u503c\u4e3a `true` \u65f6\uff0c`Slider` \u4e3a\u5782\u76f4\u65b9\u5411\u3002 \| Boolean \| `false` \|\n\| tooltip \| \u662f\u5426\u663e\u793a\u63d0\u793a\uff0c\u82e5\u8bbe\u7f6e\u4e3a `true` \u63d0\u793a\u59cb\u7ec8\u663e\u793a\uff0c\u82e5\u8bbe\u7f6e\u4e3a `null` \u5c06\u59cb\u7ec8\u4e0d\u663e\u793a\u63d0\u793a\u3002 \| Boolean \| `false` \|\n\| onChange \| \u503c\u6539\u53d8\u65f6\u89e6\u53d1 \| Function(value) \| - \|"}}}]);
2	- //# sourceMappingURL=8415.1da9a8c6.chunk.js.map

package/web/static/js/8467.6980e0c4.chunk.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- (self.webpackChunkwebsite=self.webpackChunkwebsite\|\|[]).push([[8467],{4934:function(e){function t(e){var t=new Error("Cannot find module '"+e+"'");throw t.code="MODULE_NOT_FOUND",t}t.keys=function(){return[]},t.resolve=t,t.id=4934,e.exports=t},270:function(e,t,n){"use strict";n.d(t,{Z:function(){return S}});var r=n(189),o=n(3782),i=n(5726),s=n(5752),c=n(6796),a=n(6135),d=n.n(a),l=n(2029),u=n(8133),p=n(9265),f=["version","codePen","codeSandbox"],h=function(e,t){var n=(t\|\|[]).join("\|");return e.replace(/import([\s\S]?)(?=['"])['"].['"]( ;\|;)?/gm,(function(e){return n&&new RegExp("from\\s+['\"](".concat(n,")['\"](s.+)?;?")).test(e)?e:"/* ".concat(e," **/")}))};function m(e){var t=e.version,n=e.codePen,i=e.codeSandbox,s=(0,o.Z)(e,f),a=(0,r.Z)({},s),m=(0,u.useRef)(null),x=[];if(n){var v={title:"uiw".concat(t," - demo"),js:"".concat(h(a.text\|\|"",["uiw"]).replace("export default","const APP_Default = "),'\nReactDOM.createRoot(document.getElementById("container")).render(<APP_Default />)'),html:'<div id="container" style="padding: 24px"></div>',css_external:"https://unpkg.com/uiw@".concat(t,"/dist/uiw.min.css"),js_external:"https://unpkg.com/react@18.x/umd/react.development.js;https://unpkg.com/react-dom@18.x/umd/react-dom.development.js;https://unpkg.com/classnames@2.2.6/index.js;https://unpkg.com/uiw@".concat(t,"/dist/uiw.min.js;https://unpkg.com/@uiw/codepen-require-polyfill@1.1.3/index.js")};x.push((0,p.jsx)(d(),(0,r.Z)((0,r.Z)({},v),{},{children:(0,p.jsx)("svg",{style:{fill:"currentcolor"},viewBox:"0 0 1024 1024",width:"18",height:"18",children:(0,p.jsx)("path",{d:"M123.428571 668l344.571429 229.714286v-205.142857L277.142857 565.142857z m-35.428571-82.285714l110.285714-73.714286-110.285714-73.714286v147.428572z m468 312l344.571429-229.714286-153.714286-102.857143-190.857143 127.428572v205.142857z m-44-281.714286l155.428571-104-155.428571-104-155.428571 104zM277.142857 458.857143l190.857143-127.428572V126.285714L123.428571 356z m548.571429 53.142857l110.285714 73.714286V438.285714z m-78.857143-53.142857l153.714286-102.857143-344.571429-229.714286v205.142857z m277.142857-102.857143v312q0 23.428571-19.428571 36.571429l-468 312q-12 7.428571-24.571429 7.428571t-24.571429-7.428571L19.428571 704.571429q-19.428571-13.142857-19.428571-36.571429V356q0-23.428571 19.428571-36.571429L487.428571 7.428571q12-7.428571 24.571429-7.428571t24.571429 7.428571l468 312q19.428571 13.142857 19.428571 36.571429z","p-id":"2071"})})}),"Codepen"))}if(i){var g={files:{"sandbox.config.json":{content:'{\n "template": "node",\n "container": {\n "startScript": "start",\n "node": "14"\n }\n }'},"public/index.html":{content:'<div id="container"></div>'},"src/app.js":{content:a.text},"src/index.js":{content:'import React from "react";\nimport ReactClient from "react-dom/client";\nimport App from "./app";\nReactClient.createRoot(document.getElementById("container")).render(<App />);'},".kktrc.js":{content:'import lessModules from "@kkt/less-modules";\nexport default (conf, env, options) => {\nconf = lessModules(conf, env, options);\nreturn conf;\n};'},"package.json":{content:{name:"uiw-demo",description:"uiw v".concat(t," - demo"),dependencies:{react:"18.1.0","react-dom":"18.1.0",uiw:"latest"},devDependencies:{"@kkt/less-modules":"~7.1.1",kkt:"~7.1.5"},license:"MIT",scripts:{start:"kkt start",build:"kkt build",test:"kkt test --env=jsdom"},browserslist:[">0.2%","not dead","not ie <= 11","not op_mini all"]}}}};x.push((0,p.jsx)(l.Z,(0,r.Z)((0,r.Z)({},g),{},{children:(0,p.jsx)("svg",{style:{fill:"currentcolor"},viewBox:"0 0 1024 1024",width:"18",height:"18",children:(0,p.jsx)("path",{d:"M85.333333 256l446.08-256L977.493333 256 981.333333 765.866667 531.413333 1024 85.333333 768V256z m89.088 105.856v202.965333l142.72 79.36v150.016l169.472 97.962667v-352.938667L174.421333 361.856z m714.197334 0l-312.192 177.365333v352.938667l169.472-97.962667V644.266667l142.72-79.402667V361.813333zM219.050667 281.642667l311.594666 176.810666 312.32-178.346666-165.162666-93.738667-145.493334 82.986667-146.346666-83.968L219.008 281.6z","p-id":"4089"})})}),"Codesandbox"))}return(0,p.jsx)(c.Z,(0,r.Z)((0,r.Z)({},a),{},{ref:m,toolbarExtra:(0,p.jsx)(u.Fragment,{children:x})}))}var x=n(2814),v=n(2251);function g(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.path,n=(0,v.$)(),r=n.t,o=/^http/.test(t\|\|"")?t:"https://github.com/uiwjs/uiw/blob/master/".concat(t);return(0,p.jsxs)(u.Fragment,{children:[r("footer.greeting"),o&&(0,p.jsx)("a",{href:o,target:"_blank",rel:"noopener noreferrer",children:r("footer.greetLinkText")}),(0,p.jsx)("br",{}),(0,p.jsx)("a",{href:"https://github.com/uiwjs/uiw/issues",target:"_blank",rel:"noopener noreferrer",children:r("footer.issues")}),(0,p.jsx)(x.Divider,{type:"vertical"}),(0,p.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw/issues/new",children:r("footer.bug")}),(0,p.jsx)(x.Divider,{type:"vertical"}),(0,p.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw",children:r("footer.github")}),(0,p.jsx)(x.Divider,{type:"vertical"}),(0,p.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt",children:r("footer.kkt")}),(0,p.jsx)(x.Divider,{type:"vertical"}),(0,p.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt-ssr",children:r("footer.kkt_ssr")}),(0,p.jsx)(x.Divider,{type:"vertical"}),(0,p.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"http://uiw.gitee.io",children:r("footer.io")})]})}var j="index_docinfo__3Vx8S",k="index_markdown__hcQCp",b=n(7946),w=n(3369),Z=["inline","node"],_=["data-meta","noPreview","noScroll","bgWhite","noCode","codePen","codeSandboxOption","codeSandbox","bordered"];function S(e){var t=e.renderPage,n=e.path,c=(0,b.Z)(t),a=c.mdData,d=c.loading,l=s.i8\|\|"2.0.0";return a.source?(0,p.jsxs)("div",{children:[(0,p.jsx)(x.Loader,{style:{width:"100%"},loading:d,tip:"loading...",children:(0,p.jsx)("div",{children:(0,p.jsx)(i.Z,{source:a.source,className:k,components:{code:function(e){var t,n=e.inline,i=e.node,s=(0,o.Z)(e,Z),c=s["data-meta"],d=(s.noPreview,s.noScroll,s.bgWhite,s.noCode),u=(s.codePen,s.codeSandboxOption,s.codeSandbox,s.bordered,(0,o.Z)(s,_));if(n\|\|!(0,w.pN)(c))return(0,p.jsx)("code",(0,r.Z)({},u));var f=null===(t=i.position)\|\|void 0===t?void 0:t.start.line,h=(0,w.Mx)(c)\|\|String(f),x=a.components["".concat(h)],v=(0,w.aE)(c);if(h&&"function"===typeof x){var g=a.data[h].value\|\|"";return(0,p.jsx)(m,{toolbar:v.title\|\|"\u793a\u4f8b\u5c55\u793a",disableToolbar:d,codePen:v.codePen,codeSandbox:v.codeSandbox,disableCheckered:!!v.disableCheckered,background:v.background,version:l,code:(0,p.jsx)("pre",{children:(0,p.jsx)("code",(0,r.Z)({},u))}),text:g,children:(0,p.jsx)(x,{})})}return(0,p.jsx)("code",(0,r.Z)({},u))}}})})}),(0,p.jsx)("div",{className:j,children:(0,p.jsx)(g,{path:n})})]}):null}},7946:function(e,t,n){"use strict";n.d(t,{A:function(){return d}});var r=n(1092),o=n(7791),i=n(1026),s=n(8133),c=n(2251),a=n(3208),d=function(){var e=(0,c.$)().i18n;return e.language===a.X?"":"."+e.language};t.Z=function(e){var t=(0,s.useState)({source:"",components:{},data:{}}),n=(0,i.Z)(t,2),c=n[0],a=n[1],l=d(),u=(0,s.useState)(!1),p=(0,i.Z)(u,2),f=p[0],h=p[1];return(0,s.useEffect)((function(){var t=function(){var t=(0,o.Z)((0,r.Z)().mark((function t(){var n;return(0,r.Z)().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(!e){t.next=13;break}return h((function(){return!0})),t.prev=2,t.next=5,e(l);case 5:(n=t.sent)&&a(n),t.next=12;break;case 9:t.prev=9,t.t0=t.catch(2),console.warn(t.t0);case 12:h((function(){return!1}));case 13:case"end":return t.stop()}}),t,null,[[2,9]])})));return function(){return t.apply(this,arguments)}}();t()}),[l]),{mdData:c,loading:f}}},9780:function(e,t,n){"use strict";n.r(t);var r=n(1092),o=n(7791),i=(n(8133),n(270)),s=n(9265);t.default=function(){return(0,s.jsx)(i.Z,{path:"https://github.com/uiwjs/uiw/tree/master/website/src/routes/guide/import/README.md",renderPage:(0,o.Z)((0,r.Z)().mark((function e(){var t;return(0,r.Z)().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,n.e(6423).then(n.bind(n,6423));case 2:return t=e.sent,e.abrupt("return",t.default\|\|t);case 4:case"end":return e.stop()}}),e)})))})}}}]);
2	- //# sourceMappingURL=8467.6980e0c4.chunk.js.map

package/web/static/js/8630.c63c3957.chunk.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- "use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite\|\|[]).push([[8630],{8630:function(e,t,n){n.r(t),t.default={components:{18:function(){function e(t){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(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},o=n(2814);function u(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function l(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t){return i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},i(e,t)}function a(e){var t=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 n,r=c(e);if(t){var o=c(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return s(this,n)}}function s(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function c(e){return c=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},c(e)}return function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&i(e,t)}(f,e);var t,n,s,c=a(f);function f(){var e;return u(this,f),(e=c.call(this)).state={visible:!1},e}return t=f,(n=[{key:"onClick",value:function(){this.setState({visible:!this.state.visible})}},{key:"onClosed",value:function(){this.setState({visible:!1})}},{key:"render",value:function(){return r.default.createElement("div",null,r.default.createElement(o.Modal,{title:"\u6a21\u6001\u5bf9\u8bdd\u6846",isOpen:this.state.visible,confirmText:"\u786e\u5b9a\u6309\u94ae",cancelText:"\u53d6\u6d88\u6309\u94ae",icon:r.default.createElement(o.Icon,{type:"information"}),type:"primary",onConfirm:function(){return console.log("\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01")},onCancel:function(){return console.log("\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01")},onClosed:this.onClosed.bind(this)},"React \u53ef\u4ee5\u975e\u5e38\u8f7b\u677e\u5730\u521b\u5efa\u7528\u6237\u4ea4\u4e92\u754c\u9762\u3002\u4e3a\u4f60\u5e94\u7528\u7684\u6bcf\u4e00\u4e2a\u72b6\u6001\u8bbe\u8ba1\u7b80\u6d01\u7684\u89c6\u56fe\uff0c\u5728\u6570\u636e\u6539\u53d8\u65f6 React \u4e5f\u53ef\u4ee5\u9ad8\u6548\u5730\u66f4\u65b0\u6e32\u67d3\u754c\u9762\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u4ee5\u58f0\u660e\u5f0f\u7f16\u5199UI\uff0c\u53ef\u4ee5\u8ba9\u4f60\u7684\u4ee3\u7801\u66f4\u52a0\u53ef\u9760\uff0c\u4e14\u65b9\u4fbf\u8c03\u8bd5\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u521b\u5efa\u597d\u62e5\u6709\u5404\u81ea\u72b6\u6001\u7684\u7ec4\u4ef6\uff0c\u518d\u7531\u7ec4\u4ef6\u6784\u6210\u66f4\u52a0\u590d\u6742\u7684\u754c\u9762\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u65e0\u9700\u518d\u7528\u6a21\u7248\u4ee3\u7801\uff0c\u901a\u8fc7\u4f7f\u7528JavaScript\u7f16\u5199\u7684\u7ec4\u4ef6\u4f60\u53ef\u4ee5\u66f4\u597d\u5730\u4f20\u9012\u6570\u636e\uff0c\u5c06\u5e94\u7528\u72b6\u6001\u548cDOM\u62c6\u5206\u5f00\u6765\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u65e0\u8bba\u4f60\u73b0\u5728\u6b63\u5728\u4f7f\u7528\u4ec0\u4e48\u6280\u672f\u6808\uff0c\u4f60\u90fd\u53ef\u4ee5\u968f\u65f6\u5f15\u5165 React \u5f00\u53d1\u65b0\u7279\u6027\u3002",r.default.createElement("br",null),r.default.createElement("br",null),r.default.createElement("b",null,"\u7ec4\u4ef6"),r.default.createElement("br",null),r.default.createElement("br",null),"React \u7ec4\u4ef6\u4f7f\u7528\u4e00\u4e2a\u540d\u4e3a render() \u7684\u65b9\u6cd5\uff0c \u63a5\u6536\u6570\u636e\u4f5c\u4e3a\u8f93\u5165\uff0c\u8f93\u51fa\u9875\u9762\u4e2d\u5bf9\u5e94\u5c55\u793a\u7684\u5185\u5bb9\u3002 \u4e0b\u9762\u8fd9\u4e2a\u793a\u4f8b\u4e2d\u7c7b\u4f3cXML\u7684\u5199\u6cd5\u88ab\u79f0\u4e3aJSX. \u8f93\u5165\u7684\u6570\u636e\u901a\u8fc7 this.props \u4f20\u5165 render() \u65b9\u6cd5\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u4f7f\u7528 React \u7684\u65f6\u5019\u4e5f\u53ef\u4ee5\u4e0d\u4f7f\u7528 JSX \u8bed\u6cd5 \u4f60\u53ef\u4ee5\u5728 ",r.default.createElement("a",{href:"https://babeljs.io/repl/#?presets=react&code_lz=MYewdgzgLgBApgGzgWzmWBeGAeAFgRgD4AJRBEAGhgHcQAnBAEwEJsB6AwgbgChRJY_KAEMAlmDh0YWRiGABXVOgB0AczhQAokiVQAQgE8AkowAUPGDADkdECChWeASl4AlOMOBQAIgHkAssp0aIySpogoaFBUQmISdC48QA",target:"_blank"},"Babel REPL")," \u67e5\u770b JSX \u662f\u5982\u4f55\u88ab\u6e32\u67d3\u6210\u539f\u751f JavaScript \u4ee3\u7801\u7684\u3002"),r.default.createElement(o.ButtonGroup,null,r.default.createElement(o.Button,{onClick:this.onClick.bind(this)},"\u786e\u8ba4\u5bf9\u8bdd\u6846")))}}])&&l(t.prototype,n),s&&l(t,s),Object.defineProperty(t,"prototype",{writable:!1}),f}(r.default.Component)}(),79:function(){function e(t){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(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},o=n(2814);function u(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function l(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t){return i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},i(e,t)}function a(e){var t=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 n,r=c(e);if(t){var o=c(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return s(this,n)}}function s(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function c(e){return c=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},c(e)}return function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&i(e,t)}(f,e);var t,n,s,c=a(f);function f(){var e;return u(this,f),(e=c.call(this)).state={visible:!1},e.time=null,e}return t=f,(n=[{key:"onClick",value:function(){this.setState({visible:!this.state.visible})}},{key:"onClosed",value:function(){this.setState({visible:!1})}},{key:"render",value:function(){var e=this;return r.default.createElement("div",null,r.default.createElement(o.Modal,{title:"\u6a21\u6001\u5bf9\u8bdd\u6846",isOpen:this.state.visible,confirmText:"\u786e\u5b9a\u6309\u94ae",cancelText:"\u53d6\u6d88\u6309\u94ae",type:"danger",onCancel:function(){clearTimeout(e.time),console.log("\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01")},onClosed:this.onClosed.bind(this),onConfirm:function(){return console.log("\u786e\u5b9a\u56de\u8c03\uff01, \u8fd9\u91cc\u662f\u5229\u7528Promise\u7b49\u6267\u884c\u5b8c\u6210\u518d\u53bb\u5173\u95ed\u7a97\u53e3"),new Promise((function(t,n){var r=Math.random();console.log("\u6d4b\u8bd5\uff0c\u968f\u673a\u503c\u5927\u4e8e 0.5 \u6267\u884c resolve \u4e8b\u4ef6\uff0c\u5426\u5219 \u6267\u884c reject \u89e6\u53d1 catch \u9519\u8bef",r,r>.5),e.time=setTimeout(r>.5?t:n,3e3)})).catch((function(){}))}},"\u8fd9\u662f\u4e00\u4e2a\u5355\u51fb \u201c",r.default.createElement("b",null,"\u786e\u5b9a\u6309\u94ae"),"\u201d \u5ef6\u8fdf\u5173\u95ed\u5bf9\u8bdd\u6846\u7684\u5b9e\u4f8b\uff0c\u5173\u95ed\u5bf9\u8bdd\u6846\u89e6\u53d1 \u201c",r.default.createElement("b",null,"onConfirm"),"\u201d \u6216 \u201c",r.default.createElement("b",null,"onCancel"),"\u201d \u4e8b\u4ef6\u3002",r.default.createElement("br",null),r.default.createElement("br",null)," \u8fd9\u91cc\u662f\u5229\u7528 ",r.default.createElement("b",null,"Promise")," \u7684\u7279\u6027\uff0c\u7b49\u5b83\u6267\u884c\u5b8c\u6210\u540e\uff0c\u518d\u53bb\u5173\u95ed\u7a97\u53e3\uff0c\u8fbe\u5230\u5ef6\u8fdf\u5173\u95ed\u7684\u6548\u679c\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u8fd9\u4e2a\u6d4b\u8bd5\u4f8b\u5b50\uff0c\u751f\u6210\u968f\u673a\u503c\u5224\u65ad\u662f\u5426\u5927\u4e8e ",r.default.createElement("b",null,"0.5")," \u6267\u884c ",r.default.createElement("b",null,"resolve")," \u4e8b\u4ef6\uff0c\u5426\u5219 \u6267\u884c ",r.default.createElement("b",null,"reject")," \u89e6\u53d1 ",r.default.createElement("b",null,"catch")," \u9519\u8bef\u3002"),r.default.createElement(o.ButtonGroup,null,r.default.createElement(o.Button,{onClick:this.onClick.bind(this)},"\u5ef6\u8fdf\u5173\u95ed\u5bf9\u8bdd\u6846")))}}])&&l(t.prototype,n),s&&l(t,s),Object.defineProperty(t,"prototype",{writable:!1}),f}(r.default.Component)}(),141:function(){function e(t){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(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},o=n(2814);function u(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function i(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function a(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function s(e,t){return s=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},s(e,t)}function c(e){var t=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 n,r=p(e);if(t){var o=p(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return f(this,n)}}function f(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function p(e){return p=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},p(e)}var b=function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&s(e,t)}(b,e);var t,n,f,p=c(b);function b(){var e;return i(this,b),(e=p.call(this)).state={visible:!1,loading:!1},e}return t=b,n=[{key:"onClick",value:function(){this.setState({visible:!this.state.visible})}},{key:"onClosed",value:function(){this.setState({visible:!1})}},{key:"onSubmit",value:function(e){var t=this,n=(e.initial,e.current),r={};if(n.userName.startsWith("u")&&(r.userName="\u59d3\u540d ".concat(n.userName," \u4e0d\u80fd\u4ee5 \u2018u\u2019 \u5f00\u5934")),(!n.age\|\|n.age<18\|\|n.age>30)&&(r.age="\u5e74\u9f84\u5fc5\u987b\u572818 ~ 30\u5c81\u4e4b\u95f4\u3002"),n.textarea\|\|(r.textarea="\u8bf7\u8f93\u5165\u63cf\u8ff0\u5185\u5bb9"),Object.keys(r).length>0){var o=new Error;throw o.filed=r,o}this.setState({loading:!0}),setTimeout((function(){t.setState({loading:!1,visible:!1}),Notify.success({title:"\u63d0\u4ea4\u6210\u529f\u901a\u77e5\uff01",description:"\u63d0\u4ea4\u5185\u5bb9\uff0c\u3002"})}),2e3)}},{key:"render",value:function(){var e=this;return r.default.createElement("div",null,r.default.createElement(o.Modal,{title:"\u6a21\u6001\u5bf9\u8bdd\u6846",width:900,isOpen:this.state.visible,onClosed:this.onClosed.bind(this),type:"danger",useButton:!1},r.default.createElement(o.Form,{resetOnSubmit:!1,onSubmit:this.onSubmit.bind(this),onSubmitError:function(e){return e.filed?function(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?u(Object(n),!0).forEach((function(t){l(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):u(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}({},e.filed):null},fields:{userName:{initialValue:"uiw",label:"\u59d3\u540d",help:"\u4ee5\u201cu\u201d\u5f00\u5934\u7684\u540d\u5b57\u5c06\u5728\u6b64\u5904\u663e\u793a\u9519\u8bef\u4fe1\u606f",children:r.default.createElement(o.Input,{type:"text"})},age:{initialValue:9,label:"\u5e74\u9f84",children:r.default.createElement(o.Input,{type:"number"})},textarea:{initialValue:"",label:"\u63cf\u8ff0\u8bf4\u660e",children:r.default.createElement(o.Textarea,{placeholder:"\u8bf7\u8f93\u5165\u5185\u5bb9"})}}},(function(t){var n=t.fields,u=t.state,l=t.canSubmit;return console.log("fields:--\x3e",u),r.default.createElement("div",null,r.default.createElement(o.Row,{gutter:10},r.default.createElement(o.Col,null,n.userName),r.default.createElement(o.Col,null,n.age)),r.default.createElement(o.Row,{gutter:10},r.default.createElement(o.Col,null,n.textarea)),r.default.createElement(o.Row,{gutter:10,justify:"flex-end"},r.default.createElement(o.Col,{fixed:!0},r.default.createElement(o.Button,{loading:e.state.loading,disabled:!l(),type:"primary",htmlType:"submit"},"\u63d0\u4ea4\u8868\u5355"))))}))),r.default.createElement(o.ButtonGroup,null,r.default.createElement(o.Button,{onClick:this.onClick.bind(this)},"\u8868\u5355\u4e2d\u5e94\u7528")))}}],n&&a(t.prototype,n),f&&a(t,f),Object.defineProperty(t,"prototype",{writable:!1}),b}(r.default.Component);return b}(),256:function(){function e(t){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(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},o=n(2814);function u(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function l(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t){return i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},i(e,t)}function a(e){var t=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 n,r=c(e);if(t){var o=c(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return s(this,n)}}function s(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function c(e){return c=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},c(e)}return function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&i(e,t)}(f,e);var t,n,s,c=a(f);function f(){var e;return u(this,f),(e=c.call(this)).state={visible:!1},e}return t=f,(n=[{key:"onClick",value:function(){this.setState({visible:!this.state.visible})}},{key:"onClosed",value:function(){this.setState({visible:!1})}},{key:"render",value:function(){return r.default.createElement("div",null,r.default.createElement(o.Modal,{title:"\u6a21\u6001\u5bf9\u8bdd\u6846",isOpen:this.state.visible,useButton:!1,confirmText:"\u786e\u5b9a\u6309\u94ae",cancelText:"\u53d6\u6d88\u6309\u94ae",icon:r.default.createElement(o.Icon,{type:"information"}),type:"danger",onConfirm:function(){return console.log("\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01")},onCancel:function(){return console.log("\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01")},onClosed:this.onClosed.bind(this)},"React \u53ef\u4ee5\u975e\u5e38\u8f7b\u677e\u5730\u521b\u5efa\u7528\u6237\u4ea4\u4e92\u754c\u9762\u3002\u4e3a\u4f60\u5e94\u7528\u7684\u6bcf\u4e00\u4e2a\u72b6\u6001\u8bbe\u8ba1\u7b80\u6d01\u7684\u89c6\u56fe\uff0c\u5728\u6570\u636e\u6539\u53d8\u65f6 React \u4e5f\u53ef\u4ee5\u9ad8\u6548\u5730\u66f4\u65b0\u6e32\u67d3\u754c\u9762\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u4ee5\u58f0\u660e\u5f0f\u7f16\u5199UI\uff0c\u53ef\u4ee5\u8ba9\u4f60\u7684\u4ee3\u7801\u66f4\u52a0\u53ef\u9760\uff0c\u4e14\u65b9\u4fbf\u8c03\u8bd5\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u521b\u5efa\u597d\u62e5\u6709\u5404\u81ea\u72b6\u6001\u7684\u7ec4\u4ef6\uff0c\u518d\u7531\u7ec4\u4ef6\u6784\u6210\u66f4\u52a0\u590d\u6742\u7684\u754c\u9762\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u65e0\u9700\u518d\u7528\u6a21\u7248\u4ee3\u7801\uff0c\u901a\u8fc7\u4f7f\u7528JavaScript\u7f16\u5199\u7684\u7ec4\u4ef6\u4f60\u53ef\u4ee5\u66f4\u597d\u5730\u4f20\u9012\u6570\u636e\uff0c\u5c06\u5e94\u7528\u72b6\u6001\u548cDOM\u62c6\u5206\u5f00\u6765\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u65e0\u8bba\u4f60\u73b0\u5728\u6b63\u5728\u4f7f\u7528\u4ec0\u4e48\u6280\u672f\u6808\uff0c\u4f60\u90fd\u53ef\u4ee5\u968f\u65f6\u5f15\u5165 React \u5f00\u53d1\u65b0\u7279\u6027\u3002",r.default.createElement("br",null),r.default.createElement("br",null),r.default.createElement("b",null,"\u7ec4\u4ef6"),r.default.createElement("br",null),r.default.createElement("br",null),"React \u7ec4\u4ef6\u4f7f\u7528\u4e00\u4e2a\u540d\u4e3a render() \u7684\u65b9\u6cd5\uff0c \u63a5\u6536\u6570\u636e\u4f5c\u4e3a\u8f93\u5165\uff0c\u8f93\u51fa\u9875\u9762\u4e2d\u5bf9\u5e94\u5c55\u793a\u7684\u5185\u5bb9\u3002 \u4e0b\u9762\u8fd9\u4e2a\u793a\u4f8b\u4e2d\u7c7b\u4f3cXML\u7684\u5199\u6cd5\u88ab\u79f0\u4e3aJSX. \u8f93\u5165\u7684\u6570\u636e\u901a\u8fc7 this.props \u4f20\u5165 render() \u65b9\u6cd5\u3002",r.default.createElement("br",null),r.default.createElement("br",null),"\u4f7f\u7528 React \u7684\u65f6\u5019\u4e5f\u53ef\u4ee5\u4e0d\u4f7f\u7528 JSX \u8bed\u6cd5 \u4f60\u53ef\u4ee5\u5728 Babel REPL \u67e5\u770b JSX \u662f\u5982\u4f55\u88ab\u6e32\u67d3\u6210\u539f\u751f JavaScript \u4ee3\u7801\u7684\u3002",r.default.createElement("div",{className:"w-modal-footer"},r.default.createElement(o.Button,{type:"danger",onClick:this.onClosed.bind(this)},"\u786e\u5b9a\u6309\u94ae"),r.default.createElement(o.Button,{onClick:this.onClosed.bind(this)},"\u53d6\u6d88\u6309\u94ae"))),r.default.createElement(o.ButtonGroup,null,r.default.createElement(o.Button,{onClick:this.onClick.bind(this)},"\u786e\u8ba4\u5bf9\u8bdd\u6846")))}}])&&l(t.prototype,n),s&&l(t,s),Object.defineProperty(t,"prototype",{writable:!1}),f}(r.default.Component)}(),322:function(){function e(t){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(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},o=n(2814);function u(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function l(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t){return i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},i(e,t)}function a(e){var t=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 n,r=c(e);if(t){var o=c(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return s(this,n)}}function s(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function c(e){return c=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},c(e)}var f=function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&i(e,t)}(f,e);var t,n,s,c=a(f);function f(){return u(this,f),c.apply(this,arguments)}return t=f,(n=[{key:"onClick",value:function(){o.Modal.show({confirmText:"\u77e5\u9053\u4e86",children:"\u5feb\u6377\u63d0\u793a",onConfirm:function(){return console.log("\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01")}})}},{key:"render",value:function(){return r.default.createElement("div",null,r.default.createElement(o.Button,{onClick:this.onClick.bind(this)},"\u786e\u8ba4\u5bf9\u8bdd\u6846"))}}])&&l(t.prototype,n),s&&l(t,s),Object.defineProperty(t,"prototype",{writable:!1}),f}(r.default.Component);return f}()},data:{18:{name:18,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 _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() {\n var _this;\n\n _classCallCheck(this, Demo);\n\n _this = _super.call(this);\n _this.state = {\n visible: false\n };\n return _this;\n }\n\n _createClass(Demo, [{\n key: "onClick",\n value: function onClick() {\n this.setState({\n visible: !this.state.visible\n });\n }\n }, {\n key: "onClosed",\n value: function onClosed() {\n this.setState({\n visible: false\n });\n }\n }, {\n key: "render",\n value: function render() {\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Modal, {\n title: "\\u6A21\\u6001\\u5BF9\\u8BDD\\u6846",\n isOpen: this.state.visible,\n confirmText: "\\u786E\\u5B9A\\u6309\\u94AE",\n cancelText: "\\u53D6\\u6D88\\u6309\\u94AE",\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "information"\n }),\n type: "primary",\n onConfirm: function onConfirm() {\n return console.log(\'\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01\');\n },\n onCancel: function onCancel() {\n return console.log(\'\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01\');\n },\n onClosed: this.onClosed.bind(this)\n }, "React \\u53EF\\u4EE5\\u975E\\u5E38\\u8F7B\\u677E\\u5730\\u521B\\u5EFA\\u7528\\u6237\\u4EA4\\u4E92\\u754C\\u9762\\u3002\\u4E3A\\u4F60\\u5E94\\u7528\\u7684\\u6BCF\\u4E00\\u4E2A\\u72B6\\u6001\\u8BBE\\u8BA1\\u7B80\\u6D01\\u7684\\u89C6\\u56FE\\uFF0C\\u5728\\u6570\\u636E\\u6539\\u53D8\\u65F6 React \\u4E5F\\u53EF\\u4EE5\\u9AD8\\u6548\\u5730\\u66F4\\u65B0\\u6E32\\u67D3\\u754C\\u9762\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u4EE5\\u58F0\\u660E\\u5F0F\\u7F16\\u5199UI\\uFF0C\\u53EF\\u4EE5\\u8BA9\\u4F60\\u7684\\u4EE3\\u7801\\u66F4\\u52A0\\u53EF\\u9760\\uFF0C\\u4E14\\u65B9\\u4FBF\\u8C03\\u8BD5\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u521B\\u5EFA\\u597D\\u62E5\\u6709\\u5404\\u81EA\\u72B6\\u6001\\u7684\\u7EC4\\u4EF6\\uFF0C\\u518D\\u7531\\u7EC4\\u4EF6\\u6784\\u6210\\u66F4\\u52A0\\u590D\\u6742\\u7684\\u754C\\u9762\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u65E0\\u9700\\u518D\\u7528\\u6A21\\u7248\\u4EE3\\u7801\\uFF0C\\u901A\\u8FC7\\u4F7F\\u7528JavaScript\\u7F16\\u5199\\u7684\\u7EC4\\u4EF6\\u4F60\\u53EF\\u4EE5\\u66F4\\u597D\\u5730\\u4F20\\u9012\\u6570\\u636E\\uFF0C\\u5C06\\u5E94\\u7528\\u72B6\\u6001\\u548CDOM\\u62C6\\u5206\\u5F00\\u6765\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u65E0\\u8BBA\\u4F60\\u73B0\\u5728\\u6B63\\u5728\\u4F7F\\u7528\\u4EC0\\u4E48\\u6280\\u672F\\u6808\\uFF0C\\u4F60\\u90FD\\u53EF\\u4EE5\\u968F\\u65F6\\u5F15\\u5165 React \\u5F00\\u53D1\\u65B0\\u7279\\u6027\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("b", null, "\\u7EC4\\u4EF6"), /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "React \\u7EC4\\u4EF6\\u4F7F\\u7528\\u4E00\\u4E2A\\u540D\\u4E3A render() \\u7684\\u65B9\\u6CD5\\uFF0C \\u63A5\\u6536\\u6570\\u636E\\u4F5C\\u4E3A\\u8F93\\u5165\\uFF0C\\u8F93\\u51FA\\u9875\\u9762\\u4E2D\\u5BF9\\u5E94\\u5C55\\u793A\\u7684\\u5185\\u5BB9\\u3002 \\u4E0B\\u9762\\u8FD9\\u4E2A\\u793A\\u4F8B\\u4E2D\\u7C7B\\u4F3CXML\\u7684\\u5199\\u6CD5\\u88AB\\u79F0\\u4E3AJSX. \\u8F93\\u5165\\u7684\\u6570\\u636E\\u901A\\u8FC7 this.props \\u4F20\\u5165 render() \\u65B9\\u6CD5\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u4F7F\\u7528 React \\u7684\\u65F6\\u5019\\u4E5F\\u53EF\\u4EE5\\u4E0D\\u4F7F\\u7528 JSX \\u8BED\\u6CD5 \\u4F60\\u53EF\\u4EE5\\u5728 ", /#__PURE__/_react["default"].createElement("a", {\n href: "https://babeljs.io/repl/#?presets=react&code_lz=MYewdgzgLgBApgGzgWzmWBeGAeAFgRgD4AJRBEAGhgHcQAnBAEwEJsB6AwgbgChRJY_KAEMAlmDh0YWRiGABXVOgB0AczhQAokiVQAQgE8AkowAUPGDADkdECChWeASl4AlOMOBQAIgHkAssp0aIySpogoaFBUQmISdC48QA",\n target: "_blank"\n }, "Babel REPL"), " \\u67E5\\u770B JSX \\u662F\\u5982\\u4F55\\u88AB\\u6E32\\u67D3\\u6210\\u539F\\u751F JavaScript \\u4EE3\\u7801\\u7684\\u3002"), /#__PURE__/_react["default"].createElement(_uiw.ButtonGroup, null, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n onClick: this.onClick.bind(this)\n }, "\\u786E\\u8BA4\\u5BF9\\u8BDD\\u6846")));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Modal, ButtonGroup, Button, Icon } from \'uiw\';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n visible: false,\n }\n }\n onClick() {\n this.setState({ visible: !this.state.visible });\n }\n onClosed() {\n this.setState({ visible: false });\n }\n render() {\n return (\n <div>\n <Modal\n title="\u6a21\u6001\u5bf9\u8bdd\u6846"\n isOpen={this.state.visible}\n confirmText="\u786e\u5b9a\u6309\u94ae"\n cancelText="\u53d6\u6d88\u6309\u94ae"\n icon={<Icon type="information" />}\n type="primary"\n onConfirm={() => console.log(\'\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01\')}\n onCancel={() => console.log(\'\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01\')}\n onClosed={this.onClosed.bind(this)}\n >\n React \u53ef\u4ee5\u975e\u5e38\u8f7b\u677e\u5730\u521b\u5efa\u7528\u6237\u4ea4\u4e92\u754c\u9762\u3002\u4e3a\u4f60\u5e94\u7528\u7684\u6bcf\u4e00\u4e2a\u72b6\u6001\u8bbe\u8ba1\u7b80\u6d01\u7684\u89c6\u56fe\uff0c\u5728\u6570\u636e\u6539\u53d8\u65f6 React \u4e5f\u53ef\u4ee5\u9ad8\u6548\u5730\u66f4\u65b0\u6e32\u67d3\u754c\u9762\u3002\n <br /><br />\n \u4ee5\u58f0\u660e\u5f0f\u7f16\u5199UI\uff0c\u53ef\u4ee5\u8ba9\u4f60\u7684\u4ee3\u7801\u66f4\u52a0\u53ef\u9760\uff0c\u4e14\u65b9\u4fbf\u8c03\u8bd5\u3002\n <br /><br />\n \u521b\u5efa\u597d\u62e5\u6709\u5404\u81ea\u72b6\u6001\u7684\u7ec4\u4ef6\uff0c\u518d\u7531\u7ec4\u4ef6\u6784\u6210\u66f4\u52a0\u590d\u6742\u7684\u754c\u9762\u3002\n <br /><br />\n \u65e0\u9700\u518d\u7528\u6a21\u7248\u4ee3\u7801\uff0c\u901a\u8fc7\u4f7f\u7528JavaScript\u7f16\u5199\u7684\u7ec4\u4ef6\u4f60\u53ef\u4ee5\u66f4\u597d\u5730\u4f20\u9012\u6570\u636e\uff0c\u5c06\u5e94\u7528\u72b6\u6001\u548cDOM\u62c6\u5206\u5f00\u6765\u3002\n <br /><br />\n \u65e0\u8bba\u4f60\u73b0\u5728\u6b63\u5728\u4f7f\u7528\u4ec0\u4e48\u6280\u672f\u6808\uff0c\u4f60\u90fd\u53ef\u4ee5\u968f\u65f6\u5f15\u5165 React \u5f00\u53d1\u65b0\u7279\u6027\u3002\n <br /><br />\n <b>\u7ec4\u4ef6</b>\n <br /><br />\n React \u7ec4\u4ef6\u4f7f\u7528\u4e00\u4e2a\u540d\u4e3a render() \u7684\u65b9\u6cd5\uff0c \u63a5\u6536\u6570\u636e\u4f5c\u4e3a\u8f93\u5165\uff0c\u8f93\u51fa\u9875\u9762\u4e2d\u5bf9\u5e94\u5c55\u793a\u7684\u5185\u5bb9\u3002 \u4e0b\u9762\u8fd9\u4e2a\u793a\u4f8b\u4e2d\u7c7b\u4f3cXML\u7684\u5199\u6cd5\u88ab\u79f0\u4e3aJSX. \u8f93\u5165\u7684\u6570\u636e\u901a\u8fc7 this.props \u4f20\u5165 render() \u65b9\u6cd5\u3002\n <br /><br />\n \u4f7f\u7528 React \u7684\u65f6\u5019\u4e5f\u53ef\u4ee5\u4e0d\u4f7f\u7528 JSX \u8bed\u6cd5 \u4f60\u53ef\u4ee5\u5728 <a href="https://babeljs.io/repl/#?presets=react&code_lz=MYewdgzgLgBApgGzgWzmWBeGAeAFgRgD4AJRBEAGhgHcQAnBAEwEJsB6AwgbgChRJY_KAEMAlmDh0YWRiGABXVOgB0AczhQAokiVQAQgE8AkowAUPGDADkdECChWeASl4AlOMOBQAIgHkAssp0aIySpogoaFBUQmISdC48QA" target="_blank">Babel REPL</a> \u67e5\u770b JSX \u662f\u5982\u4f55\u88ab\u6e32\u67d3\u6210\u539f\u751f JavaScript \u4ee3\u7801\u7684\u3002\n </Modal>\n <ButtonGroup>\n <Button onClick={this.onClick.bind(this)}>\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n </ButtonGroup>\n </div>\n )\n }\n}\nexport default Demo'},79:{name:79,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 _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() {\n var _this;\n\n _classCallCheck(this, Demo);\n\n _this = _super.call(this);\n _this.state = {\n visible: false\n };\n _this.time = null;\n return _this;\n }\n\n _createClass(Demo, [{\n key: "onClick",\n value: function onClick() {\n this.setState({\n visible: !this.state.visible\n });\n }\n }, {\n key: "onClosed",\n value: function onClosed() {\n this.setState({\n visible: false\n });\n }\n }, {\n key: "render",\n value: function render() {\n var _this2 = this;\n\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Modal, {\n title: "\\u6A21\\u6001\\u5BF9\\u8BDD\\u6846",\n isOpen: this.state.visible,\n confirmText: "\\u786E\\u5B9A\\u6309\\u94AE",\n cancelText: "\\u53D6\\u6D88\\u6309\\u94AE",\n type: "danger",\n onCancel: function onCancel() {\n clearTimeout(_this2.time);\n console.log(\'\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01\');\n },\n onClosed: this.onClosed.bind(this),\n onConfirm: function onConfirm() {\n console.log(\'\u786e\u5b9a\u56de\u8c03\uff01, \u8fd9\u91cc\u662f\u5229\u7528Promise\u7b49\u6267\u884c\u5b8c\u6210\u518d\u53bb\u5173\u95ed\u7a97\u53e3\');\n return new Promise(function (resolve, reject) {\n var random = Math.random();\n console.log(\'\u6d4b\u8bd5\uff0c\u968f\u673a\u503c\u5927\u4e8e 0.5 \u6267\u884c resolve \u4e8b\u4ef6\uff0c\u5426\u5219 \u6267\u884c reject \u89e6\u53d1 catch \u9519\u8bef\', random, random > 0.5);\n _this2.time = setTimeout(random > 0.5 ? resolve : reject, 3000);\n })["catch"](function () {// \u53ef\u4ee5\u901a\u8fc7\u4e0b\u9762\u65b9\u5f0f\uff0c\u963b\u6b62\u5f39\u6846\u6d88\u5931\n // throw new Error();\n });\n }\n }, "\\u8FD9\\u662F\\u4E00\\u4E2A\\u5355\\u51FB \\u201C", /#__PURE__/_react["default"].createElement("b", null, "\\u786E\\u5B9A\\u6309\\u94AE"), "\\u201D \\u5EF6\\u8FDF\\u5173\\u95ED\\u5BF9\\u8BDD\\u6846\\u7684\\u5B9E\\u4F8B\\uFF0C\\u5173\\u95ED\\u5BF9\\u8BDD\\u6846\\u89E6\\u53D1 \\u201C", /#__PURE__/_react["default"].createElement("b", null, "onConfirm"), "\\u201D \\u6216 \\u201C", /#__PURE__/_react["default"].createElement("b", null, "onCancel"), "\\u201D \\u4E8B\\u4EF6\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), " \\u8FD9\\u91CC\\u662F\\u5229\\u7528 ", /#__PURE__/_react["default"].createElement("b", null, "Promise"), " \\u7684\\u7279\\u6027\\uFF0C\\u7B49\\u5B83\\u6267\\u884C\\u5B8C\\u6210\\u540E\\uFF0C\\u518D\\u53BB\\u5173\\u95ED\\u7A97\\u53E3\\uFF0C\\u8FBE\\u5230\\u5EF6\\u8FDF\\u5173\\u95ED\\u7684\\u6548\\u679C\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u8FD9\\u4E2A\\u6D4B\\u8BD5\\u4F8B\\u5B50\\uFF0C\\u751F\\u6210\\u968F\\u673A\\u503C\\u5224\\u65AD\\u662F\\u5426\\u5927\\u4E8E ", /#__PURE__/_react["default"].createElement("b", null, "0.5"), " \\u6267\\u884C ", /#__PURE__/_react["default"].createElement("b", null, "resolve"), " \\u4E8B\\u4EF6\\uFF0C\\u5426\\u5219 \\u6267\\u884C ", /#__PURE__/_react["default"].createElement("b", null, "reject"), " \\u89E6\\u53D1 ", /#__PURE__/_react["default"].createElement("b", null, "catch"), " \\u9519\\u8BEF\\u3002"), /#__PURE__/_react["default"].createElement(_uiw.ButtonGroup, null, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n onClick: this.onClick.bind(this)\n }, "\\u5EF6\\u8FDF\\u5173\\u95ED\\u5BF9\\u8BDD\\u6846")));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Modal, ButtonGroup, Button } from 'uiw';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n visible: false,\n }\n this.time = null\n }\n onClick() {\n this.setState({ visible: !this.state.visible });\n }\n onClosed() {\n this.setState({ visible: false });\n }\n render() {\n return (\n <div>\n <Modal\n title=\"\u6a21\u6001\u5bf9\u8bdd\u6846\"\n isOpen={this.state.visible}\n confirmText=\"\u786e\u5b9a\u6309\u94ae\"\n cancelText=\"\u53d6\u6d88\u6309\u94ae\"\n type=\"danger\"\n onCancel={() => {\n clearTimeout(this.time)\n console.log('\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01')\n }}\n onClosed={this.onClosed.bind(this)}\n onConfirm={() => {\n console.log('\u786e\u5b9a\u56de\u8c03\uff01, \u8fd9\u91cc\u662f\u5229\u7528Promise\u7b49\u6267\u884c\u5b8c\u6210\u518d\u53bb\u5173\u95ed\u7a97\u53e3');\n return new Promise((resolve, reject) => {\n const random = Math.random();\n console.log('\u6d4b\u8bd5\uff0c\u968f\u673a\u503c\u5927\u4e8e 0.5 \u6267\u884c resolve \u4e8b\u4ef6\uff0c\u5426\u5219 \u6267\u884c reject \u89e6\u53d1 catch \u9519\u8bef', random, random > 0.5)\n this.time = setTimeout(random > 0.5 ? resolve : reject, 3000);\n }).catch(() => {\n // \u53ef\u4ee5\u901a\u8fc7\u4e0b\u9762\u65b9\u5f0f\uff0c\u963b\u6b62\u5f39\u6846\u6d88\u5931\n // throw new Error();\n });\n }}\n >\n \u8fd9\u662f\u4e00\u4e2a\u5355\u51fb \u201c<b>\u786e\u5b9a\u6309\u94ae</b>\u201d \u5ef6\u8fdf\u5173\u95ed\u5bf9\u8bdd\u6846\u7684\u5b9e\u4f8b\uff0c\u5173\u95ed\u5bf9\u8bdd\u6846\u89e6\u53d1 \u201c<b>onConfirm</b>\u201d \u6216 \u201c<b>onCancel</b>\u201d \u4e8b\u4ef6\u3002<br /><br /> \u8fd9\u91cc\u662f\u5229\u7528 <b>Promise</b> \u7684\u7279\u6027\uff0c\u7b49\u5b83\u6267\u884c\u5b8c\u6210\u540e\uff0c\u518d\u53bb\u5173\u95ed\u7a97\u53e3\uff0c\u8fbe\u5230\u5ef6\u8fdf\u5173\u95ed\u7684\u6548\u679c\u3002<br /><br />\n \u8fd9\u4e2a\u6d4b\u8bd5\u4f8b\u5b50\uff0c\u751f\u6210\u968f\u673a\u503c\u5224\u65ad\u662f\u5426\u5927\u4e8e <b>0.5</b> \u6267\u884c <b>resolve</b> \u4e8b\u4ef6\uff0c\u5426\u5219 \u6267\u884c <b>reject</b> \u89e6\u53d1 <b>catch</b> \u9519\u8bef\u3002\n </Modal>\n <ButtonGroup>\n <Button onClick={this.onClick.bind(this)}>\u5ef6\u8fdf\u5173\u95ed\u5bf9\u8bdd\u6846</Button>\n </ButtonGroup>\n </div>\n )\n }\n}\nexport default Demo"},141:{name:141,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() {\n var _this;\n\n _classCallCheck(this, Demo);\n\n _this = _super.call(this);\n _this.state = {\n visible: false,\n loading: false\n };\n return _this;\n }\n\n _createClass(Demo, [{\n key: "onClick",\n value: function onClick() {\n this.setState({\n visible: !this.state.visible\n });\n }\n }, {\n key: "onClosed",\n value: function onClosed() {\n this.setState({\n visible: false\n });\n }\n }, {\n key: "onSubmit",\n value: function onSubmit(_ref) {\n var _this2 = this;\n\n var initial = _ref.initial,\n current = _ref.current;\n var errorObj = {};\n\n if (current.userName.startsWith(\'u\')) {\n errorObj.userName = "\\u59D3\\u540D ".concat(current.userName, " \\u4E0D\\u80FD\\u4EE5 \\u2018u\\u2019 \\u5F00\\u5934");\n }\n\n if (!current.age \|\| current.age < 18 \|\| current.age > 30) {\n errorObj.age = \'\u5e74\u9f84\u5fc5\u987b\u572818 ~ 30\u5c81\u4e4b\u95f4\u3002\';\n }\n\n if (!current.textarea) {\n errorObj.textarea = \'\u8bf7\u8f93\u5165\u63cf\u8ff0\u5185\u5bb9\';\n }\n\n if (Object.keys(errorObj).length > 0) {\n var err = new Error();\n err.filed = errorObj;\n throw err;\n }\n\n this.setState({\n loading: true\n });\n setTimeout(function () {\n _this2.setState({\n loading: false,\n visible: false\n });\n\n Notify.success({\n title: \'\u63d0\u4ea4\u6210\u529f\u901a\u77e5\uff01\',\n description: \'\u63d0\u4ea4\u5185\u5bb9\uff0c\u3002\'\n });\n }, 2000);\n }\n }, {\n key: "render",\n value: function render() {\n var _this3 = this;\n\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Modal, {\n title: "\\u6A21\\u6001\\u5BF9\\u8BDD\\u6846",\n width: 900,\n isOpen: this.state.visible,\n onClosed: this.onClosed.bind(this),\n type: "danger",\n useButton: false\n }, /#__PURE__/_react["default"].createElement(_uiw.Form, {\n resetOnSubmit: false,\n onSubmit: this.onSubmit.bind(this),\n onSubmitError: function onSubmitError(error) {\n if (error.filed) {\n return _objectSpread({}, error.filed);\n }\n\n return null;\n },\n fields: {\n userName: {\n initialValue: \'uiw\',\n label: \'\u59d3\u540d\',\n help: \'\u4ee5\u201cu\u201d\u5f00\u5934\u7684\u540d\u5b57\u5c06\u5728\u6b64\u5904\u663e\u793a\u9519\u8bef\u4fe1\u606f\',\n children: /#__PURE__/_react["default"].createElement(_uiw.Input, {\n type: "text"\n })\n },\n age: {\n initialValue: 9,\n label: \'\u5e74\u9f84\',\n children: /#__PURE__/_react["default"].createElement(_uiw.Input, {\n type: "number"\n })\n },\n textarea: {\n initialValue: \'\',\n label: \'\u63cf\u8ff0\u8bf4\u660e\',\n children: /#__PURE__/_react["default"].createElement(_uiw.Textarea, {\n placeholder: "\\u8BF7\\u8F93\\u5165\\u5185\\u5BB9"\n })\n }\n }\n }, function (_ref2) {\n var fields = _ref2.fields,\n state = _ref2.state,\n canSubmit = _ref2.canSubmit;\n console.log(\'fields:--\x3e\', state);\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Row, {\n gutter: 10\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, null, fields.userName), /#__PURE__/_react["default"].createElement(_uiw.Col, null, fields.age)), /#__PURE__/_react["default"].createElement(_uiw.Row, {\n gutter: 10\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, null, fields.textarea)), /#__PURE__/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "flex-end"\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n loading: _this3.state.loading,\n disabled: !canSubmit(),\n type: "primary",\n htmlType: "submit"\n }, "\\u63D0\\u4EA4\\u8868\\u5355"))));\n })), /#__PURE__/_react["default"].createElement(_uiw.ButtonGroup, null, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n onClick: this.onClick.bind(this)\n }, "\\u8868\\u5355\\u4E2D\\u5E94\\u7528")));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Modal, ButtonGroup, Button, Form, Input, Textarea, Row, Col } from 'uiw';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n visible: false,\n loading: false,\n }\n }\n onClick() {\n this.setState({ visible: !this.state.visible });\n }\n onClosed() {\n this.setState({ visible: false });\n }\n onSubmit({ initial, current }) {\n const errorObj = {};\n if (current.userName.startsWith('u')) {\n errorObj.userName = `\u59d3\u540d ${current.userName} \u4e0d\u80fd\u4ee5 \u2018u\u2019 \u5f00\u5934`;\n }\n if (!current.age \|\| current.age < 18 \|\| current.age > 30) {\n errorObj.age = '\u5e74\u9f84\u5fc5\u987b\u572818 ~ 30\u5c81\u4e4b\u95f4\u3002';\n }\n if (!current.textarea) {\n errorObj.textarea = '\u8bf7\u8f93\u5165\u63cf\u8ff0\u5185\u5bb9';\n }\n if(Object.keys(errorObj).length > 0) {\n const err = new Error();\n err.filed = errorObj;\n throw err;\n }\n\n this.setState({ loading: true });\n setTimeout(() => {\n this.setState({ loading: false, visible: false });\n Notify.success({ title: '\u63d0\u4ea4\u6210\u529f\u901a\u77e5\uff01', description: '\u63d0\u4ea4\u5185\u5bb9\uff0c\u3002' });\n }, 2000);\n }\n render() {\n return (\n <div>\n <Modal\n title=\"\u6a21\u6001\u5bf9\u8bdd\u6846\"\n width={900}\n isOpen={this.state.visible}\n onClosed={this.onClosed.bind(this)}\n type=\"danger\"\n useButton={false}\n >\n <Form\n resetOnSubmit={false}\n onSubmit={this.onSubmit.bind(this)}\n onSubmitError={(error) => {\n if (error.filed) {\n return { ...error.filed };\n }\n return null;\n }}\n fields={{\n userName: {\n initialValue: 'uiw',\n label: '\u59d3\u540d',\n help: '\u4ee5\u201cu\u201d\u5f00\u5934\u7684\u540d\u5b57\u5c06\u5728\u6b64\u5904\u663e\u793a\u9519\u8bef\u4fe1\u606f',\n children: <Input type=\"text\" />\n },\n age: {\n initialValue: 9,\n label: '\u5e74\u9f84',\n children: <Input type=\"number\" />\n },\n textarea: {\n initialValue: '',\n label: '\u63cf\u8ff0\u8bf4\u660e',\n children: <Textarea placeholder=\"\u8bf7\u8f93\u5165\u5185\u5bb9\" />\n },\n }}\n >\n {({ fields, state, canSubmit }) => {\n console.log('fields:--\x3e', state);\n return (\n <div>\n <Row gutter={10}>\n <Col>{fields.userName}</Col>\n <Col>{fields.age}</Col>\n </Row>\n <Row gutter={10}>\n <Col>{fields.textarea}</Col>\n </Row>\n <Row gutter={10} justify=\"flex-end\">\n <Col fixed>\n <Button loading={this.state.loading} disabled={!canSubmit()} type=\"primary\" htmlType=\"submit\">\u63d0\u4ea4\u8868\u5355</Button>\n </Col>\n </Row>\n </div>\n )\n }}\n </Form>\n </Modal>\n <ButtonGroup>\n <Button onClick={this.onClick.bind(this)}>\u8868\u5355\u4e2d\u5e94\u7528</Button>\n </ButtonGroup>\n </div>\n )\n }\n}\nexport default Demo"},256:{name:256,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 _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() {\n var _this;\n\n _classCallCheck(this, Demo);\n\n _this = _super.call(this);\n _this.state = {\n visible: false\n };\n return _this;\n }\n\n _createClass(Demo, [{\n key: "onClick",\n value: function onClick() {\n this.setState({\n visible: !this.state.visible\n });\n }\n }, {\n key: "onClosed",\n value: function onClosed() {\n this.setState({\n visible: false\n });\n }\n }, {\n key: "render",\n value: function render() {\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Modal, {\n title: "\\u6A21\\u6001\\u5BF9\\u8BDD\\u6846",\n isOpen: this.state.visible,\n useButton: false,\n confirmText: "\\u786E\\u5B9A\\u6309\\u94AE",\n cancelText: "\\u53D6\\u6D88\\u6309\\u94AE",\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "information"\n }),\n type: "danger",\n onConfirm: function onConfirm() {\n return console.log(\'\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01\');\n },\n onCancel: function onCancel() {\n return console.log(\'\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01\');\n },\n onClosed: this.onClosed.bind(this)\n }, "React \\u53EF\\u4EE5\\u975E\\u5E38\\u8F7B\\u677E\\u5730\\u521B\\u5EFA\\u7528\\u6237\\u4EA4\\u4E92\\u754C\\u9762\\u3002\\u4E3A\\u4F60\\u5E94\\u7528\\u7684\\u6BCF\\u4E00\\u4E2A\\u72B6\\u6001\\u8BBE\\u8BA1\\u7B80\\u6D01\\u7684\\u89C6\\u56FE\\uFF0C\\u5728\\u6570\\u636E\\u6539\\u53D8\\u65F6 React \\u4E5F\\u53EF\\u4EE5\\u9AD8\\u6548\\u5730\\u66F4\\u65B0\\u6E32\\u67D3\\u754C\\u9762\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u4EE5\\u58F0\\u660E\\u5F0F\\u7F16\\u5199UI\\uFF0C\\u53EF\\u4EE5\\u8BA9\\u4F60\\u7684\\u4EE3\\u7801\\u66F4\\u52A0\\u53EF\\u9760\\uFF0C\\u4E14\\u65B9\\u4FBF\\u8C03\\u8BD5\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u521B\\u5EFA\\u597D\\u62E5\\u6709\\u5404\\u81EA\\u72B6\\u6001\\u7684\\u7EC4\\u4EF6\\uFF0C\\u518D\\u7531\\u7EC4\\u4EF6\\u6784\\u6210\\u66F4\\u52A0\\u590D\\u6742\\u7684\\u754C\\u9762\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u65E0\\u9700\\u518D\\u7528\\u6A21\\u7248\\u4EE3\\u7801\\uFF0C\\u901A\\u8FC7\\u4F7F\\u7528JavaScript\\u7F16\\u5199\\u7684\\u7EC4\\u4EF6\\u4F60\\u53EF\\u4EE5\\u66F4\\u597D\\u5730\\u4F20\\u9012\\u6570\\u636E\\uFF0C\\u5C06\\u5E94\\u7528\\u72B6\\u6001\\u548CDOM\\u62C6\\u5206\\u5F00\\u6765\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u65E0\\u8BBA\\u4F60\\u73B0\\u5728\\u6B63\\u5728\\u4F7F\\u7528\\u4EC0\\u4E48\\u6280\\u672F\\u6808\\uFF0C\\u4F60\\u90FD\\u53EF\\u4EE5\\u968F\\u65F6\\u5F15\\u5165 React \\u5F00\\u53D1\\u65B0\\u7279\\u6027\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("b", null, "\\u7EC4\\u4EF6"), /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "React \\u7EC4\\u4EF6\\u4F7F\\u7528\\u4E00\\u4E2A\\u540D\\u4E3A render() \\u7684\\u65B9\\u6CD5\\uFF0C \\u63A5\\u6536\\u6570\\u636E\\u4F5C\\u4E3A\\u8F93\\u5165\\uFF0C\\u8F93\\u51FA\\u9875\\u9762\\u4E2D\\u5BF9\\u5E94\\u5C55\\u793A\\u7684\\u5185\\u5BB9\\u3002 \\u4E0B\\u9762\\u8FD9\\u4E2A\\u793A\\u4F8B\\u4E2D\\u7C7B\\u4F3CXML\\u7684\\u5199\\u6CD5\\u88AB\\u79F0\\u4E3AJSX. \\u8F93\\u5165\\u7684\\u6570\\u636E\\u901A\\u8FC7 this.props \\u4F20\\u5165 render() \\u65B9\\u6CD5\\u3002", /#__PURE__/_react["default"].createElement("br", null), /#__PURE__/_react["default"].createElement("br", null), "\\u4F7F\\u7528 React \\u7684\\u65F6\\u5019\\u4E5F\\u53EF\\u4EE5\\u4E0D\\u4F7F\\u7528 JSX \\u8BED\\u6CD5 \\u4F60\\u53EF\\u4EE5\\u5728 Babel REPL \\u67E5\\u770B JSX \\u662F\\u5982\\u4F55\\u88AB\\u6E32\\u67D3\\u6210\\u539F\\u751F JavaScript \\u4EE3\\u7801\\u7684\\u3002", /#__PURE__/_react["default"].createElement("div", {\n className: "w-modal-footer"\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n type: "danger",\n onClick: this.onClosed.bind(this)\n }, "\\u786E\\u5B9A\\u6309\\u94AE"), /#__PURE__/_react["default"].createElement(_uiw.Button, {\n onClick: this.onClosed.bind(this)\n }, "\\u53D6\\u6D88\\u6309\\u94AE"))), /#__PURE__/_react["default"].createElement(_uiw.ButtonGroup, null, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n onClick: this.onClick.bind(this)\n }, "\\u786E\\u8BA4\\u5BF9\\u8BDD\\u6846")));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Modal, ButtonGroup, Button, Icon } from \'uiw\';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n visible: false,\n }\n }\n onClick() {\n this.setState({ visible: !this.state.visible });\n }\n onClosed() {\n this.setState({ visible: false });\n }\n render() {\n return (\n <div>\n <Modal\n title="\u6a21\u6001\u5bf9\u8bdd\u6846"\n isOpen={this.state.visible}\n useButton={false}\n confirmText="\u786e\u5b9a\u6309\u94ae"\n cancelText="\u53d6\u6d88\u6309\u94ae"\n icon={<Icon type="information" />}\n type="danger"\n onConfirm={() => console.log(\'\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01\')}\n onCancel={() => console.log(\'\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01\')}\n onClosed={this.onClosed.bind(this)}\n >\n React \u53ef\u4ee5\u975e\u5e38\u8f7b\u677e\u5730\u521b\u5efa\u7528\u6237\u4ea4\u4e92\u754c\u9762\u3002\u4e3a\u4f60\u5e94\u7528\u7684\u6bcf\u4e00\u4e2a\u72b6\u6001\u8bbe\u8ba1\u7b80\u6d01\u7684\u89c6\u56fe\uff0c\u5728\u6570\u636e\u6539\u53d8\u65f6 React \u4e5f\u53ef\u4ee5\u9ad8\u6548\u5730\u66f4\u65b0\u6e32\u67d3\u754c\u9762\u3002\n <br /><br />\n \u4ee5\u58f0\u660e\u5f0f\u7f16\u5199UI\uff0c\u53ef\u4ee5\u8ba9\u4f60\u7684\u4ee3\u7801\u66f4\u52a0\u53ef\u9760\uff0c\u4e14\u65b9\u4fbf\u8c03\u8bd5\u3002\n <br /><br />\n \u521b\u5efa\u597d\u62e5\u6709\u5404\u81ea\u72b6\u6001\u7684\u7ec4\u4ef6\uff0c\u518d\u7531\u7ec4\u4ef6\u6784\u6210\u66f4\u52a0\u590d\u6742\u7684\u754c\u9762\u3002\n <br /><br />\n \u65e0\u9700\u518d\u7528\u6a21\u7248\u4ee3\u7801\uff0c\u901a\u8fc7\u4f7f\u7528JavaScript\u7f16\u5199\u7684\u7ec4\u4ef6\u4f60\u53ef\u4ee5\u66f4\u597d\u5730\u4f20\u9012\u6570\u636e\uff0c\u5c06\u5e94\u7528\u72b6\u6001\u548cDOM\u62c6\u5206\u5f00\u6765\u3002\n <br /><br />\n \u65e0\u8bba\u4f60\u73b0\u5728\u6b63\u5728\u4f7f\u7528\u4ec0\u4e48\u6280\u672f\u6808\uff0c\u4f60\u90fd\u53ef\u4ee5\u968f\u65f6\u5f15\u5165 React \u5f00\u53d1\u65b0\u7279\u6027\u3002\n <br /><br />\n <b>\u7ec4\u4ef6</b>\n <br /><br />\n React \u7ec4\u4ef6\u4f7f\u7528\u4e00\u4e2a\u540d\u4e3a render() \u7684\u65b9\u6cd5\uff0c \u63a5\u6536\u6570\u636e\u4f5c\u4e3a\u8f93\u5165\uff0c\u8f93\u51fa\u9875\u9762\u4e2d\u5bf9\u5e94\u5c55\u793a\u7684\u5185\u5bb9\u3002 \u4e0b\u9762\u8fd9\u4e2a\u793a\u4f8b\u4e2d\u7c7b\u4f3cXML\u7684\u5199\u6cd5\u88ab\u79f0\u4e3aJSX. \u8f93\u5165\u7684\u6570\u636e\u901a\u8fc7 this.props \u4f20\u5165 render() \u65b9\u6cd5\u3002\n <br /><br />\n \u4f7f\u7528 React \u7684\u65f6\u5019\u4e5f\u53ef\u4ee5\u4e0d\u4f7f\u7528 JSX \u8bed\u6cd5 \u4f60\u53ef\u4ee5\u5728 Babel REPL \u67e5\u770b JSX \u662f\u5982\u4f55\u88ab\u6e32\u67d3\u6210\u539f\u751f JavaScript \u4ee3\u7801\u7684\u3002\n <div className="w-modal-footer">\n <Button type="danger" onClick={this.onClosed.bind(this)} >\u786e\u5b9a\u6309\u94ae</Button>\n <Button onClick={this.onClosed.bind(this)} >\u53d6\u6d88\u6309\u94ae</Button>\n </div>\n </Modal>\n <ButtonGroup>\n <Button onClick={this.onClick.bind(this)}>\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n </ButtonGroup>\n </div>\n )\n }\n}\nexport default Demo'},322:{name:322,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 _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() {\n _classCallCheck(this, Demo);\n\n return _super.apply(this, arguments);\n }\n\n _createClass(Demo, [{\n key: "onClick",\n value: function onClick() {\n _uiw.Modal.show({\n confirmText: "\u77e5\u9053\u4e86",\n children: "\u5feb\u6377\u63d0\u793a",\n onConfirm: function onConfirm() {\n return console.log(\'\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01\');\n }\n });\n }\n }, {\n key: "render",\n value: function render() {\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n onClick: this.onClick.bind(this)\n }, "\\u786E\\u8BA4\\u5BF9\\u8BDD\\u6846"));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Modal, ButtonGroup, Button } from 'uiw';\n\nclass Demo extends React.Component {\n onClick() {\n Modal.show({\n confirmText: \"\u77e5\u9053\u4e86\",\n children: \"\u5feb\u6377\u63d0\u793a\",\n onConfirm: () => console.log('\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01'),\n })\n }\n render() {\n return (\n <div>\n <Button onClick={this.onClick.bind(this)}>\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n </div>\n )\n }\n}\nexport default Demo"}},source:"Modal \u6a21\u6001\u5bf9\u8bdd\u6846\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-modal/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-modal.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-modal)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-modal.svg?label=@uiw/react-modal)](https://npmjs.com/@uiw/react-modal)\n\n\u6a21\u6001\u5bf9\u8bdd\u6846\u3002\n\n```jsx\nimport { Modal } from 'uiw';\n// or\nimport Modal from '@uiw/react-modal';\n```\n\n### \u57fa\u672c\u7528\u6cd5\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Modal, ButtonGroup, Button, Icon } from 'uiw';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n visible: false,\n }\n }\n onClick() {\n this.setState({ visible: !this.state.visible });\n }\n onClosed() {\n this.setState({ visible: false });\n }\n render() {\n return (\n <div>\n <Modal\n title=\"\u6a21\u6001\u5bf9\u8bdd\u6846\"\n isOpen={this.state.visible}\n confirmText=\"\u786e\u5b9a\u6309\u94ae\"\n cancelText=\"\u53d6\u6d88\u6309\u94ae\"\n icon={<Icon type=\"information\" />}\n type=\"primary\"\n onConfirm={() => console.log('\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01')}\n onCancel={() => console.log('\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01')}\n onClosed={this.onClosed.bind(this)}\n >\n React \u53ef\u4ee5\u975e\u5e38\u8f7b\u677e\u5730\u521b\u5efa\u7528\u6237\u4ea4\u4e92\u754c\u9762\u3002\u4e3a\u4f60\u5e94\u7528\u7684\u6bcf\u4e00\u4e2a\u72b6\u6001\u8bbe\u8ba1\u7b80\u6d01\u7684\u89c6\u56fe\uff0c\u5728\u6570\u636e\u6539\u53d8\u65f6 React \u4e5f\u53ef\u4ee5\u9ad8\u6548\u5730\u66f4\u65b0\u6e32\u67d3\u754c\u9762\u3002\n <br /><br />\n \u4ee5\u58f0\u660e\u5f0f\u7f16\u5199UI\uff0c\u53ef\u4ee5\u8ba9\u4f60\u7684\u4ee3\u7801\u66f4\u52a0\u53ef\u9760\uff0c\u4e14\u65b9\u4fbf\u8c03\u8bd5\u3002\n <br /><br />\n \u521b\u5efa\u597d\u62e5\u6709\u5404\u81ea\u72b6\u6001\u7684\u7ec4\u4ef6\uff0c\u518d\u7531\u7ec4\u4ef6\u6784\u6210\u66f4\u52a0\u590d\u6742\u7684\u754c\u9762\u3002\n <br /><br />\n \u65e0\u9700\u518d\u7528\u6a21\u7248\u4ee3\u7801\uff0c\u901a\u8fc7\u4f7f\u7528JavaScript\u7f16\u5199\u7684\u7ec4\u4ef6\u4f60\u53ef\u4ee5\u66f4\u597d\u5730\u4f20\u9012\u6570\u636e\uff0c\u5c06\u5e94\u7528\u72b6\u6001\u548cDOM\u62c6\u5206\u5f00\u6765\u3002\n <br /><br />\n \u65e0\u8bba\u4f60\u73b0\u5728\u6b63\u5728\u4f7f\u7528\u4ec0\u4e48\u6280\u672f\u6808\uff0c\u4f60\u90fd\u53ef\u4ee5\u968f\u65f6\u5f15\u5165 React \u5f00\u53d1\u65b0\u7279\u6027\u3002\n <br /><br />\n <b>\u7ec4\u4ef6</b>\n <br /><br />\n React \u7ec4\u4ef6\u4f7f\u7528\u4e00\u4e2a\u540d\u4e3a render() \u7684\u65b9\u6cd5\uff0c \u63a5\u6536\u6570\u636e\u4f5c\u4e3a\u8f93\u5165\uff0c\u8f93\u51fa\u9875\u9762\u4e2d\u5bf9\u5e94\u5c55\u793a\u7684\u5185\u5bb9\u3002 \u4e0b\u9762\u8fd9\u4e2a\u793a\u4f8b\u4e2d\u7c7b\u4f3cXML\u7684\u5199\u6cd5\u88ab\u79f0\u4e3aJSX. \u8f93\u5165\u7684\u6570\u636e\u901a\u8fc7 this.props \u4f20\u5165 render() \u65b9\u6cd5\u3002\n <br /><br />\n \u4f7f\u7528 React \u7684\u65f6\u5019\u4e5f\u53ef\u4ee5\u4e0d\u4f7f\u7528 JSX \u8bed\u6cd5 \u4f60\u53ef\u4ee5\u5728 <a href=\"https://babeljs.io/repl/#?presets=react&code_lz=MYewdgzgLgBApgGzgWzmWBeGAeAFgRgD4AJRBEAGhgHcQAnBAEwEJsB6AwgbgChRJY_KAEMAlmDh0YWRiGABXVOgB0AczhQAokiVQAQgE8AkowAUPGDADkdECChWeASl4AlOMOBQAIgHkAssp0aIySpogoaFBUQmISdC48QA\" target=\"_blank\">Babel REPL</a> \u67e5\u770b JSX \u662f\u5982\u4f55\u88ab\u6e32\u67d3\u6210\u539f\u751f JavaScript \u4ee3\u7801\u7684\u3002\n </Modal>\n <ButtonGroup>\n <Button onClick={this.onClick.bind(this)}>\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n </ButtonGroup>\n </div>\n )\n }\n}\nexport default Demo\n```\n\n### \u5ef6\u8fdf\u5173\u95ed\u5bf9\u8bdd\u6846\n\n\u8fd9\u91cc\u662f\u5229\u7528 `Promise` \u7b49\u5b83\u6267\u884c\u5b8c\u6210\u518d\u53bb\u5173\u95ed\u7a97\u53e3\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Modal, ButtonGroup, Button } from 'uiw';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n visible: false,\n }\n this.time = null\n }\n onClick() {\n this.setState({ visible: !this.state.visible });\n }\n onClosed() {\n this.setState({ visible: false });\n }\n render() {\n return (\n <div>\n <Modal\n title=\"\u6a21\u6001\u5bf9\u8bdd\u6846\"\n isOpen={this.state.visible}\n confirmText=\"\u786e\u5b9a\u6309\u94ae\"\n cancelText=\"\u53d6\u6d88\u6309\u94ae\"\n type=\"danger\"\n onCancel={() => {\n clearTimeout(this.time)\n console.log('\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01')\n }}\n onClosed={this.onClosed.bind(this)}\n onConfirm={() => {\n console.log('\u786e\u5b9a\u56de\u8c03\uff01, \u8fd9\u91cc\u662f\u5229\u7528Promise\u7b49\u6267\u884c\u5b8c\u6210\u518d\u53bb\u5173\u95ed\u7a97\u53e3');\n return new Promise((resolve, reject) => {\n const random = Math.random();\n console.log('\u6d4b\u8bd5\uff0c\u968f\u673a\u503c\u5927\u4e8e 0.5 \u6267\u884c resolve \u4e8b\u4ef6\uff0c\u5426\u5219 \u6267\u884c reject \u89e6\u53d1 catch \u9519\u8bef', random, random > 0.5)\n this.time = setTimeout(random > 0.5 ? resolve : reject, 3000);\n }).catch(() => {\n // \u53ef\u4ee5\u901a\u8fc7\u4e0b\u9762\u65b9\u5f0f\uff0c\u963b\u6b62\u5f39\u6846\u6d88\u5931\n // throw new Error();\n });\n }}\n >\n \u8fd9\u662f\u4e00\u4e2a\u5355\u51fb \u201c<b>\u786e\u5b9a\u6309\u94ae</b>\u201d \u5ef6\u8fdf\u5173\u95ed\u5bf9\u8bdd\u6846\u7684\u5b9e\u4f8b\uff0c\u5173\u95ed\u5bf9\u8bdd\u6846\u89e6\u53d1 \u201c<b>onConfirm</b>\u201d \u6216 \u201c<b>onCancel</b>\u201d \u4e8b\u4ef6\u3002<br /><br /> \u8fd9\u91cc\u662f\u5229\u7528 <b>Promise</b> \u7684\u7279\u6027\uff0c\u7b49\u5b83\u6267\u884c\u5b8c\u6210\u540e\uff0c\u518d\u53bb\u5173\u95ed\u7a97\u53e3\uff0c\u8fbe\u5230\u5ef6\u8fdf\u5173\u95ed\u7684\u6548\u679c\u3002<br /><br />\n \u8fd9\u4e2a\u6d4b\u8bd5\u4f8b\u5b50\uff0c\u751f\u6210\u968f\u673a\u503c\u5224\u65ad\u662f\u5426\u5927\u4e8e <b>0.5</b> \u6267\u884c <b>resolve</b> \u4e8b\u4ef6\uff0c\u5426\u5219 \u6267\u884c <b>reject</b> \u89e6\u53d1 <b>catch</b> \u9519\u8bef\u3002\n </Modal>\n <ButtonGroup>\n <Button onClick={this.onClick.bind(this)}>\u5ef6\u8fdf\u5173\u95ed\u5bf9\u8bdd\u6846</Button>\n </ButtonGroup>\n </div>\n )\n }\n}\nexport default Demo\n```\n\n\n### \u8868\u5355\u5e94\u7528\n\n\u8fd9\u91cc\u662f\u5229\u7528 `Promise` \u7b49\u5b83\u6267\u884c\u5b8c\u6210\u518d\u53bb\u5173\u95ed\u7a97\u53e3\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Modal, ButtonGroup, Button, Form, Input, Textarea, Row, Col } from 'uiw';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n visible: false,\n loading: false,\n }\n }\n onClick() {\n this.setState({ visible: !this.state.visible });\n }\n onClosed() {\n this.setState({ visible: false });\n }\n onSubmit({ initial, current }) {\n const errorObj = {};\n if (current.userName.startsWith('u')) {\n errorObj.userName = `\u59d3\u540d ${current.userName} \u4e0d\u80fd\u4ee5 \u2018u\u2019 \u5f00\u5934`;\n }\n if (!current.age \|\| current.age < 18 \|\| current.age > 30) {\n errorObj.age = '\u5e74\u9f84\u5fc5\u987b\u572818 ~ 30\u5c81\u4e4b\u95f4\u3002';\n }\n if (!current.textarea) {\n errorObj.textarea = '\u8bf7\u8f93\u5165\u63cf\u8ff0\u5185\u5bb9';\n }\n if(Object.keys(errorObj).length > 0) {\n const err = new Error();\n err.filed = errorObj;\n throw err;\n }\n\n this.setState({ loading: true });\n setTimeout(() => {\n this.setState({ loading: false, visible: false });\n Notify.success({ title: '\u63d0\u4ea4\u6210\u529f\u901a\u77e5\uff01', description: '\u63d0\u4ea4\u5185\u5bb9\uff0c\u3002' });\n }, 2000);\n }\n render() {\n return (\n <div>\n <Modal\n title=\"\u6a21\u6001\u5bf9\u8bdd\u6846\"\n width={900}\n isOpen={this.state.visible}\n onClosed={this.onClosed.bind(this)}\n type=\"danger\"\n useButton={false}\n >\n <Form\n resetOnSubmit={false}\n onSubmit={this.onSubmit.bind(this)}\n onSubmitError={(error) => {\n if (error.filed) {\n return { ...error.filed };\n }\n return null;\n }}\n fields={{\n userName: {\n initialValue: 'uiw',\n label: '\u59d3\u540d',\n help: '\u4ee5\u201cu\u201d\u5f00\u5934\u7684\u540d\u5b57\u5c06\u5728\u6b64\u5904\u663e\u793a\u9519\u8bef\u4fe1\u606f',\n children: <Input type=\"text\" />\n },\n age: {\n initialValue: 9,\n label: '\u5e74\u9f84',\n children: <Input type=\"number\" />\n },\n textarea: {\n initialValue: '',\n label: '\u63cf\u8ff0\u8bf4\u660e',\n children: <Textarea placeholder=\"\u8bf7\u8f93\u5165\u5185\u5bb9\" />\n },\n }}\n >\n {({ fields, state, canSubmit }) => {\n console.log('fields:--\x3e', state);\n return (\n <div>\n <Row gutter={10}>\n <Col>{fields.userName}</Col>\n <Col>{fields.age}</Col>\n </Row>\n <Row gutter={10}>\n <Col>{fields.textarea}</Col>\n </Row>\n <Row gutter={10} justify=\"flex-end\">\n <Col fixed>\n <Button loading={this.state.loading} disabled={!canSubmit()} type=\"primary\" htmlType=\"submit\">\u63d0\u4ea4\u8868\u5355</Button>\n </Col>\n </Row>\n </div>\n )\n }}\n </Form>\n </Modal>\n <ButtonGroup>\n <Button onClick={this.onClick.bind(this)}>\u8868\u5355\u4e2d\u5e94\u7528</Button>\n </ButtonGroup>\n </div>\n )\n }\n}\nexport default Demo\n```\n\n### \u81ea\u5b9a\u4e49\u9875\u811a\n\n\u8bbe\u7f6e `useButton={false}` \u9690\u85cf\u9ed8\u8ba4\u7684\u6309\u94ae\uff0c\u518d\u6839\u636e\u81ea\u5df1\u9700\u6c42\u5b9a\u4e49\u6309\u94ae\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Modal, ButtonGroup, Button, Icon } from 'uiw';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n visible: false,\n }\n }\n onClick() {\n this.setState({ visible: !this.state.visible });\n }\n onClosed() {\n this.setState({ visible: false });\n }\n render() {\n return (\n <div>\n <Modal\n title=\"\u6a21\u6001\u5bf9\u8bdd\u6846\"\n isOpen={this.state.visible}\n useButton={false}\n confirmText=\"\u786e\u5b9a\u6309\u94ae\"\n cancelText=\"\u53d6\u6d88\u6309\u94ae\"\n icon={<Icon type=\"information\" />}\n type=\"danger\"\n onConfirm={() => console.log('\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01')}\n onCancel={() => console.log('\u60a8\u70b9\u51fb\u4e86\u53d6\u6d88\u6309\u94ae\uff01')}\n onClosed={this.onClosed.bind(this)}\n >\n React \u53ef\u4ee5\u975e\u5e38\u8f7b\u677e\u5730\u521b\u5efa\u7528\u6237\u4ea4\u4e92\u754c\u9762\u3002\u4e3a\u4f60\u5e94\u7528\u7684\u6bcf\u4e00\u4e2a\u72b6\u6001\u8bbe\u8ba1\u7b80\u6d01\u7684\u89c6\u56fe\uff0c\u5728\u6570\u636e\u6539\u53d8\u65f6 React \u4e5f\u53ef\u4ee5\u9ad8\u6548\u5730\u66f4\u65b0\u6e32\u67d3\u754c\u9762\u3002\n <br /><br />\n \u4ee5\u58f0\u660e\u5f0f\u7f16\u5199UI\uff0c\u53ef\u4ee5\u8ba9\u4f60\u7684\u4ee3\u7801\u66f4\u52a0\u53ef\u9760\uff0c\u4e14\u65b9\u4fbf\u8c03\u8bd5\u3002\n <br /><br />\n \u521b\u5efa\u597d\u62e5\u6709\u5404\u81ea\u72b6\u6001\u7684\u7ec4\u4ef6\uff0c\u518d\u7531\u7ec4\u4ef6\u6784\u6210\u66f4\u52a0\u590d\u6742\u7684\u754c\u9762\u3002\n <br /><br />\n \u65e0\u9700\u518d\u7528\u6a21\u7248\u4ee3\u7801\uff0c\u901a\u8fc7\u4f7f\u7528JavaScript\u7f16\u5199\u7684\u7ec4\u4ef6\u4f60\u53ef\u4ee5\u66f4\u597d\u5730\u4f20\u9012\u6570\u636e\uff0c\u5c06\u5e94\u7528\u72b6\u6001\u548cDOM\u62c6\u5206\u5f00\u6765\u3002\n <br /><br />\n \u65e0\u8bba\u4f60\u73b0\u5728\u6b63\u5728\u4f7f\u7528\u4ec0\u4e48\u6280\u672f\u6808\uff0c\u4f60\u90fd\u53ef\u4ee5\u968f\u65f6\u5f15\u5165 React \u5f00\u53d1\u65b0\u7279\u6027\u3002\n <br /><br />\n <b>\u7ec4\u4ef6</b>\n <br /><br />\n React \u7ec4\u4ef6\u4f7f\u7528\u4e00\u4e2a\u540d\u4e3a render() \u7684\u65b9\u6cd5\uff0c \u63a5\u6536\u6570\u636e\u4f5c\u4e3a\u8f93\u5165\uff0c\u8f93\u51fa\u9875\u9762\u4e2d\u5bf9\u5e94\u5c55\u793a\u7684\u5185\u5bb9\u3002 \u4e0b\u9762\u8fd9\u4e2a\u793a\u4f8b\u4e2d\u7c7b\u4f3cXML\u7684\u5199\u6cd5\u88ab\u79f0\u4e3aJSX. \u8f93\u5165\u7684\u6570\u636e\u901a\u8fc7 this.props \u4f20\u5165 render() \u65b9\u6cd5\u3002\n <br /><br />\n \u4f7f\u7528 React \u7684\u65f6\u5019\u4e5f\u53ef\u4ee5\u4e0d\u4f7f\u7528 JSX \u8bed\u6cd5 \u4f60\u53ef\u4ee5\u5728 Babel REPL \u67e5\u770b JSX \u662f\u5982\u4f55\u88ab\u6e32\u67d3\u6210\u539f\u751f JavaScript \u4ee3\u7801\u7684\u3002\n <div className=\"w-modal-footer\">\n <Button type=\"danger\" onClick={this.onClosed.bind(this)} >\u786e\u5b9a\u6309\u94ae</Button>\n <Button onClick={this.onClosed.bind(this)} >\u53d6\u6d88\u6309\u94ae</Button>\n </div>\n </Modal>\n <ButtonGroup>\n <Button onClick={this.onClick.bind(this)}>\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n </ButtonGroup>\n </div>\n )\n }\n}\nexport default Demo\n```\n\n### \u5feb\u6377\u5f39\u51fa\n\n\u4f7f\u7528 show() \u53ef\u4ee5\u5feb\u6377\u5730\u5f39\u51fa\u786e\u8ba4\u6846\u3002\u63a5\u53d7\u7684\u53c2\u6570\u4e0e ModalProps \u4e00\u6837, \u53ea\u662f\u5c11\u4e86 isOpen \u4e0e onClosed\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from 'react';\nimport { Modal, ButtonGroup, Button } from 'uiw';\n\nclass Demo extends React.Component {\n onClick() {\n Modal.show({\n confirmText: \"\u77e5\u9053\u4e86\",\n children: \"\u5feb\u6377\u63d0\u793a\",\n onConfirm: () => console.log('\u60a8\u70b9\u51fb\u4e86\u786e\u5b9a\u6309\u94ae\uff01'),\n })\n }\n render() {\n return (\n <div>\n <Button onClick={this.onClick.bind(this)}>\u786e\u8ba4\u5bf9\u8bdd\u6846</Button>\n </div>\n )\n }\n}\nexport default Demo\n```\n\n## Props\n\n\| \u53c2\u6570 \| \u8bf4\u660e \| \u7c7b\u578b \| \u9ed8\u8ba4\u503c \|\n\|--------- \|-------- \|--------- \|-------- \|\n\| title \| \u8bbe\u7f6e\u6807\u9898 \| Function(e) \| - \|\n\| onCancel \| \u53d6\u6d88\u6309\u94ae\u7684\u56de\u8c03\u51fd\u6570 \| Function(e) \| - \|\n\| onConfirm \| \u70b9\u51fb\u786e\u5b9a\u6309\u94ae\u56de\u8c03 \| Function(e) \| - \|\n\| cancelText \| \u53d6\u6d88\u6309\u94ae\u6587\u5b57\uff0c \| String \| - \|\n\| confirmText \| \u786e\u8ba4\u6309\u94ae\u6587\u5b57 \| String \| `\u786e\u8ba4` \|\n\| icon \| \u8bbe\u7f6e\u5bf9\u8bdd\u6846\u5de6\u4e0a\u89d2\u56fe\u6807\uff0c\u8bbe\u7f6e `type` \u5c06\u56fe\u6807\u8bbe\u7f6e\u4e0d\u540c\u7684\u989c\u8272\u3002\u5f53\u524d\u5c5e\u6027\u4e3a [`<Icon>`](#/components/icon) \u7ec4\u4ef6\u7684 `type` \u5c5e\u6027\uff0c\u6240\u4ee5\u53ef\u4ee5\u53c2\u8003\u8be5\u7ec4\u4ef6\u81ea\u5b9a\u4e49\u56fe\u6807\u3002 \| String/ReactNode \| - \|\n\| useButton \| \u662f\u5426\u4f7f\u7528\u9ed8\u8ba4\u6309\u94ae\uff0c\u5982\u679c\u8bbe\u7f6e `false` \u9700\u8981\u81ea\u5b9a\u4e49\u6309\u94ae\u5173\u95ed \| Boolean \| `true` \|\n\| type \| \u6309\u94ae\u7c7b\u578b\u8ddf `<Button>` \u7ec4\u4ef6\u7684 `type` \u53c2\u6570\u4e00\u81f4\uff0c\u540c\u65f6\u4f1a\u5f71\u54cd\u6309\u94ae\u989c\u8272\u3002 \| String \| `light` \|\n\| width \| \u8bbe\u7f6e\u5f39\u51fa\u6846\u5bbd\u5ea6 \| Number \| - \|\n\| bodyStyle \| Modal body \u6837\u5f0f \| `CSSProperties` \| - \|\n\| cancelButtonProps \| cancel \u6309\u94ae props \| `ButtonProps` \| - \|\n\| confirmButtonProps \| confirm \u6309\u94ae props \| `ButtonProps` \| - \|\n\| maxWidth \| \u9ed8\u8ba4\u5f39\u51fa\u6846\u6700\u5927\u5bbd\u5ea6 `500` \| Number \| `500` \|\n\| minWidth \| \u9ed8\u8ba4\u5f39\u51fa\u6846\u6700\u5c0f\u5bbd\u5ea6 `320` \| Number \| `320` \|\n\| isCloseButtonShown \| \u662f\u5426\u5728\u5bf9\u8bdd\u6846\u7684\u6807\u9898\u4e2d\u663e\u793a\u5173\u95ed\u6309\u94ae\u3002 \u8bf7\u6ce8\u610f\uff0c\u53ea\u6709\u5728\u63d0\u4f9b\u6807\u9898\u65f6\u624d\u4f1a\u5448\u73b0\u6807\u9898\u3002 \| Boolean \| `true` \|\n\| isOpen[`<Overlay>`](#/components/overlay) \| \u5bf9\u8bdd\u6846\u662f\u5426\u53ef\u89c1 \| Boolean \| `false` \|\n\| maskClosable[`<Overlay>`](#/components/overlay) \| \u70b9\u51fb\u906e\u7f69\u5c42\u662f\u5426\u5141\u8bb8\u5173\u95ed \| Boolean \| `true` \|\n\n## Modal.show(params)\n\nparams: Omit<ModalProps, \\'onClosed\\' \\\| \\'isOpen\\'> & { children: React.ReactNode }\n\n\n\u66f4\u591a\u5c5e\u6027\u6587\u6863\u8bf7\u53c2\u8003 [Overlay](#/components/overlay)\u3002\n"}}}]);
2	- //# sourceMappingURL=8630.c63c3957.chunk.js.map