@uiw/doc
Version:
UIW documentation website.
2 lines • 27.1 kB
JavaScript
(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[677],{4934:e=>{function t(e){var t=new Error("Cannot find module '"+e+"'");throw t.code="MODULE_NOT_FOUND",t}t.keys=()=>[],t.resolve=t,t.id=4934,e.exports=t},5301:(e,t,n)=>{"use strict";n.d(t,{Z:()=>m});var r=n(8573),o=n(6320),i=n(8563),s=n(7622),u=n(7937);const a={docinfo:"index_docinfo__3Vx8S",markdown:"index_markdown__hcQCp",markdownWrap:"index_markdownWrap__t60jR"};var c=n(4760);function l(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};const{path:t}=e,n=/^http/.test(t||"")?t:"https://github.com/uiwjs/uiw/blob/master/".concat(t);return(0,c.jsxs)("div",{className:a.docinfo,children:["\u72af\u4e86\u9519\u8bef\u8fd8\u662f\u60f3\u5bf9\u6587\u4ef6\u505a\u51fa\u8d21\u732e\uff1f",n&&(0,c.jsx)("a",{href:n,target:"_blank",rel:"noopener noreferrer",children:"\u5728Github\u4e0a\u7f16\u8f91\u672c\u9875\uff01"}),(0,c.jsx)("br",{}),(0,c.jsx)("a",{href:"https://github.com/uiwjs/uiw/issues",target:"_blank",rel:"noopener noreferrer",children:"\u53cd\u9988\u5efa\u8bae"}),(0,c.jsx)(u.Divider,{type:"vertical"}),(0,c.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw/issues/new",children:"\u63d0\u4ea4bug"}),(0,c.jsx)(u.Divider,{type:"vertical"}),(0,c.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw",children:"Github"}),(0,c.jsx)(u.Divider,{type:"vertical"}),(0,c.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt",children:"kkt"}),(0,c.jsx)(u.Divider,{type:"vertical"}),(0,c.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt-ssr",children:"@kkt/ssr"}),(0,c.jsx)(u.Divider,{type:"vertical"}),(0,c.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"http://uiw.gitee.io",children:"\u56fd\u5185\u955c\u50cf"})]})}const p=o.ZP.Preview,f=o.ZP.Code,y=o.ZP.Toolbar,d=e=>{var t,n;let{node:s,components:u,data:a,...l}=e;const d=(0,r.useRef)(null),{headings:m,headingsList:b,...h}=l;(0,r.useEffect)((()=>{if(d.current){const e=d.current.parentElement;e&&e.parentElement&&e.parentElement.replaceChild(d.current,e)}}),[d]);const _=null===s||void 0===s||null===(t=s.position)||void 0===t?void 0:t.start.line,v=null===s||void 0===s||null===(n=s.data)||void 0===n?void 0:n.meta,g=(0,i.Mx)(v)||String(_),C=u["".concat(g)];if(g&&"function"===typeof C){const e=a[g].value||"",t=(0,i.aE)(v||"");return(0,c.jsxs)(o.ZP,{ref:d,children:[(0,c.jsx)(p,{style:{background:t.bg||"transparent"},children:(0,c.jsx)(C,{})}),(0,c.jsx)(y,{text:e,children:t.title||"Example"}),(0,c.jsx)(f,{children:(0,c.jsx)("pre",{...h})})]})}return(0,c.jsx)("code",{...h})};function m(e){return(0,c.jsxs)(r.Fragment,{children:[(0,c.jsx)(s.Z,{className:a.markdownWrap,source:e.source||"",disableCopy:!0,wrapperElement:{"data-color-mode":"light"},components:{code:t=>(0,c.jsx)(d,{...e,...t})}}),(0,c.jsx)(l,{path:e.path})]})}},7969:(e,t,n)=>{"use strict";n.r(t),n.d(t,{default:()=>s});const r={components:{19: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(8573))&&t.__esModule?t:{default:t},o=n(7937);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 s(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,u(r.key),r)}}function u(t){var n=function(t,n){if("object"!==e(t)||null===t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var o=r.call(t,n||"default");if("object"!==e(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(t)}(t,"string");return"symbol"===e(n)?n:String(n)}function a(e,t){return a=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},a(e,t)}function c(t){var n=function(){if("undefined"===typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"===typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var r,o=l(t);if(n){var i=l(this).constructor;r=Reflect.construct(o,arguments,i)}else r=o.apply(this,arguments);return function(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)}(this,r)}}function l(e){return l=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},l(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&&a(e,t)}(p,e);var t,n,u,l=c(p);function p(){var e;return i(this,p),(e=l.call(this)).state={message:""},e}return t=p,(n=[{key:"render",value:function(){var e=this;return r.default.createElement("div",null,r.default.createElement(o.CopyToClipboard,{text:"\u6211\u88ab\u4e00\u4e2a\u8fde\u63a5\u590d\u5236\u4e86\uff01",onClick:function(){e.setState({message:"\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002"},(function(){setTimeout((function(){e.setState({message:""})}),2e3)}))}},"\u70b9\u51fb\u6211\u590d\u5236"),r.default.createElement("div",{style:{color:"#28a745"}},this.state.message))}}])&&s(t.prototype,n),u&&s(t,u),Object.defineProperty(t,"prototype",{writable:!1}),p}(r.default.Component)}(),55: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(8573))&&t.__esModule?t:{default:t},o=n(7937);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 s(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,u(r.key),r)}}function u(t){var n=function(t,n){if("object"!==e(t)||null===t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var o=r.call(t,n||"default");if("object"!==e(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(t)}(t,"string");return"symbol"===e(n)?n:String(n)}function a(e,t){return a=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},a(e,t)}function c(t){var n=function(){if("undefined"===typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"===typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var r,o=l(t);if(n){var i=l(this).constructor;r=Reflect.construct(o,arguments,i)}else r=o.apply(this,arguments);return function(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)}(this,r)}}function l(e){return l=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},l(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&&a(e,t)}(p,e);var t,n,u,l=c(p);function p(e){var t;return i(this,p),(t=l.call(this,e)).state={copyText:"\u751f\u4ea6\u4f55\u6b22\uff0c\u6b7b\u4ea6\u4f55\u82e6"},t.input=r.default.createRef(),t}return t=p,(n=[{key:"onChange",value:function(e){}},{key:"render",value:function(){var e=this,t=this.state.copyText;return r.default.createElement("div",null,r.default.createElement("div",null,r.default.createElement(o.Input,{type:"text",ref:this.input,value:t,onChange:this.onChange.bind(this)})),r.default.createElement(o.CopyToClipboard,{style:{marginTop:10,display:"inline-block"},text:t,onClick:function(){e.setState({message:"\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002"},(function(){setTimeout((function(){e.setState({message:""})}),2e3)})),e.input.current.select()}},r.default.createElement(o.Button,{type:"primary"},"\u70b9\u51fb\u590d\u5236"),r.default.createElement("span",{style:{color:"#28a745"}},this.state.message)))}}])&&s(t.prototype,n),u&&s(t,u),Object.defineProperty(t,"prototype",{writable:!1}),p}(r.default.Component)}()},data:{19:{name:19,meta:{bg:"#fff"},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; } }\nfunction _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }\nvar _react = _interopRequireDefault(require("react"));\nvar _uiw = require("uiw");\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\nfunction _classCallCheck(instance, Constructor) { if (!_instanceof(instance, Constructor)) { throw new TypeError("Cannot call a class as a function"); } }\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, _toPropertyKey(descriptor.key), descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }\nfunction _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }\nfunction _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }\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); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\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); }; }\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); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn\'t been initialised - super() hasn\'t been called"); } return self; }\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; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nvar Demo = /*#__PURE__*/function (_React$Component) {\n _inherits(Demo, _React$Component);\n var _super = _createSuper(Demo);\n function Demo() {\n var _this;\n _classCallCheck(this, Demo);\n _this = _super.call(this);\n _this.state = {\n message: \'\'\n };\n return _this;\n }\n _createClass(Demo, [{\n key: "render",\n value: function render() {\n var _this2 = this;\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.CopyToClipboard, {\n text: "\\u6211\\u88AB\\u4E00\\u4E2A\\u8FDE\\u63A5\\u590D\\u5236\\u4E86\\uFF01",\n onClick: function onClick() {\n _this2.setState({\n message: \'\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002\'\n }, function () {\n setTimeout(function () {\n _this2.setState({\n message: \'\'\n });\n }, 2000);\n });\n }\n }, "\\u70B9\\u51FB\\u6211\\u590D\\u5236"), /*#__PURE__*/_react["default"].createElement("div", {\n style: {\n color: \'#28a745\'\n }\n }, this.state.message));\n }\n }]);\n return Demo;\n}(_react["default"].Component);\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { CopyToClipboard } from 'uiw';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n message: ''\n }\n }\n render() {\n return (\n <div>\n <CopyToClipboard\n text=\"\u6211\u88ab\u4e00\u4e2a\u8fde\u63a5\u590d\u5236\u4e86\uff01\"\n onClick={() => {\n this.setState({ message: '\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002' }, () => {\n setTimeout(() => {\n this.setState({ message: '' });\n }, 2000);\n });\n }}\n >\n \u70b9\u51fb\u6211\u590d\u5236\n </CopyToClipboard>\n <div style={{color: '#28a745'}}>{this.state.message}</div>\n </div>\n )\n }\n}\nexport default Demo;"},55:{name:55,meta:{bg:"#fff"},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; } }\nfunction _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }\nvar _react = _interopRequireDefault(require("react"));\nvar _uiw = require("uiw");\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\nfunction _classCallCheck(instance, Constructor) { if (!_instanceof(instance, Constructor)) { throw new TypeError("Cannot call a class as a function"); } }\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, _toPropertyKey(descriptor.key), descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }\nfunction _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }\nfunction _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }\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); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\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); }; }\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); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn\'t been initialised - super() hasn\'t been called"); } return self; }\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; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nvar Demo = /*#__PURE__*/function (_React$Component) {\n _inherits(Demo, _React$Component);\n var _super = _createSuper(Demo);\n function Demo(props) {\n var _this;\n _classCallCheck(this, Demo);\n _this = _super.call(this, props);\n _this.state = {\n copyText: "\u751f\u4ea6\u4f55\u6b22\uff0c\u6b7b\u4ea6\u4f55\u82e6"\n };\n _this.input = /*#__PURE__*/_react["default"].createRef();\n return _this;\n }\n _createClass(Demo, [{\n key: "onChange",\n value: function onChange(e) {\n // this.setState({\n // copyText: e.target.value\n // })\n }\n }, {\n key: "render",\n value: function render() {\n var _this2 = this;\n var copyText = this.state.copyText;\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Input, {\n type: "text",\n ref: this.input,\n value: copyText,\n onChange: this.onChange.bind(this)\n })), /*#__PURE__*/_react["default"].createElement(_uiw.CopyToClipboard, {\n style: {\n marginTop: 10,\n display: \'inline-block\'\n },\n text: copyText,\n onClick: function onClick() {\n // \u590d\u5236\u63d0\u793a\n _this2.setState({\n message: \'\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002\'\n }, function () {\n setTimeout(function () {\n _this2.setState({\n message: \'\'\n });\n }, 2000);\n });\n _this2.input.current.select();\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Button, {\n type: "primary"\n }, "\\u70B9\\u51FB\\u590D\\u5236"), /*#__PURE__*/_react["default"].createElement("span", {\n style: {\n color: \'#28a745\'\n }\n }, this.state.message)));\n }\n }]);\n return Demo;\n}(_react["default"].Component);\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { CopyToClipboard, Input, Button } from 'uiw';\n\nclass Demo extends React.Component {\n constructor(props){\n super(props);\n this.state = {\n copyText: \"\u751f\u4ea6\u4f55\u6b22\uff0c\u6b7b\u4ea6\u4f55\u82e6\"\n };\n this.input = React.createRef();\n }\n onChange(e){\n // this.setState({\n // copyText: e.target.value\n // })\n }\n render() {\n const { copyText } = this.state;\n return (\n <div>\n <div>\n <Input\n type=\"text\"\n ref={this.input}\n value={copyText}\n onChange={this.onChange.bind(this)}\n />\n </div>\n <CopyToClipboard \n style={{ marginTop:10, display:'inline-block' }} \n text={copyText}\n onClick={() => {\n // \u590d\u5236\u63d0\u793a\n this.setState({ message: '\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002' }, () => {\n setTimeout(() => {\n this.setState({ message: '' });\n }, 2000);\n });\n this.input.current.select();\n }}\n >\n <Button type=\"primary\">\u70b9\u51fb\u590d\u5236</Button>\n <span style={{color: '#28a745'}}>{this.state.message}</span>\n </CopyToClipboard>\n </div>\n )\n }\n}\nexport default Demo;"}},source:"CopyToClipboard \u590d\u5236\n===\n\n[](https://jaywcjlove.github.io/#/sponsor)\n[](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-copy-to-clipboard/file/README.md)\n[](https://www.npmjs.com/package/@uiw/react-copy-to-clipboard)\n[](https://npmjs.com/@uiw/react-copy-to-clipboard)\n\n\u5c06\u6587\u672c\u5230\u526a\u5207\u677f\uff0c\u590d\u5236\u5230\u526a\u8d34\u677f\u529f\u80fd\u53ef\u4ee5\u5e94\u7528\u4e8e\u5404\u79cd\u5143\u7d20\uff0c\u57fa\u4e8e [@uiwjs/copy-to-clipboard](https://github.com/uiwjs/copy-to-clipboard) \u5c01\u88c5\u3002\n\n```jsx\nimport { CopyToClipboard } from 'uiw';\n// or\nimport CopyToClipboard from '@uiw/react-copy-to-clipboard';\n```\n\n### \u57fa\u7840\u5b9e\u4f8b\n\n```jsx mdx:preview&bg=#fff\nimport React from 'react';\nimport { CopyToClipboard } from 'uiw';\n\nclass Demo extends React.Component {\n constructor() {\n super();\n this.state = {\n message: ''\n }\n }\n render() {\n return (\n <div>\n <CopyToClipboard\n text=\"\u6211\u88ab\u4e00\u4e2a\u8fde\u63a5\u590d\u5236\u4e86\uff01\"\n onClick={() => {\n this.setState({ message: '\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002' }, () => {\n setTimeout(() => {\n this.setState({ message: '' });\n }, 2000);\n });\n }}\n >\n \u70b9\u51fb\u6211\u590d\u5236\n </CopyToClipboard>\n <div style={{color: '#28a745'}}>{this.state.message}</div>\n </div>\n )\n }\n}\nexport default Demo;\n```\n\n## \u590d\u5236\u8f93\u5165\u6846\u5185\u5bb9\n\n```jsx mdx:preview&bg=#fff\nimport React from 'react';\nimport { CopyToClipboard, Input, Button } from 'uiw';\n\nclass Demo extends React.Component {\n constructor(props){\n super(props);\n this.state = {\n copyText: \"\u751f\u4ea6\u4f55\u6b22\uff0c\u6b7b\u4ea6\u4f55\u82e6\"\n };\n this.input = React.createRef();\n }\n onChange(e){\n // this.setState({\n // copyText: e.target.value\n // })\n }\n render() {\n const { copyText } = this.state;\n return (\n <div>\n <div>\n <Input\n type=\"text\"\n ref={this.input}\n value={copyText}\n onChange={this.onChange.bind(this)}\n />\n </div>\n <CopyToClipboard \n style={{ marginTop:10, display:'inline-block' }} \n text={copyText}\n onClick={() => {\n // \u590d\u5236\u63d0\u793a\n this.setState({ message: '\u590d\u5236\u6210\u529f\uff01\u4f60\u53ef\u4ee5\u7c98\u8d34\u4e86\u3002' }, () => {\n setTimeout(() => {\n this.setState({ message: '' });\n }, 2000);\n });\n this.input.current.select();\n }}\n >\n <Button type=\"primary\">\u70b9\u51fb\u590d\u5236</Button>\n <span style={{color: '#28a745'}}>{this.state.message}</span>\n </CopyToClipboard>\n </div>\n )\n }\n}\nexport default Demo;\n```\n\n## CopyToClipboard\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| text | \u62f7\u8d1d\u7684\u6587\u672c | String | - |\n| onClick | \u70b9\u51fb\u4e8b\u4ef6 | Function(text,isCopy,event) | - |\n",headings:[],headingsList:[]};var o=n(5301),i=n(4760);function s(){return(0,i.jsx)(o.Z,{...r,path:"https://github.com/uiwjs/uiw/tree/master/packages/react-copy-to-clipboard/README.md"})}}}]);
//# sourceMappingURL=677.7cea71cd.chunk.js.map