update docs site
This commit is contained in:
dntzhang
parent
6965cc4b9b
commit
aabd53c3be
|
|
@ -1,14 +1,14 @@
|
|||
{
|
||||
"cn.css": "static/css/cn.4dd07f49.css",
|
||||
"cn.css.map": "static/css/cn.4dd07f49.css.map",
|
||||
"cn.js": "static/js/cn.ac61e6ce.js",
|
||||
"cn.js.map": "static/js/cn.ac61e6ce.js.map",
|
||||
"cn.js": "static/js/cn.c4d9a6a3.js",
|
||||
"cn.js.map": "static/js/cn.c4d9a6a3.js.map",
|
||||
"index.css": "static/css/index.4dd07f49.css",
|
||||
"index.css.map": "static/css/index.4dd07f49.css.map",
|
||||
"index.js": "static/js/index.b0a09b3e.js",
|
||||
"index.js.map": "static/js/index.b0a09b3e.js.map",
|
||||
"static/js/0.f6b49677.chunk.js": "static/js/0.f6b49677.chunk.js",
|
||||
"static/js/0.f6b49677.chunk.js.map": "static/js/0.f6b49677.chunk.js.map",
|
||||
"index.js": "static/js/index.4980fddd.js",
|
||||
"index.js.map": "static/js/index.4980fddd.js.map",
|
||||
"static/js/0.9d92ee7d.chunk.js": "static/js/0.9d92ee7d.chunk.js",
|
||||
"static/js/0.9d92ee7d.chunk.js.map": "static/js/0.9d92ee7d.chunk.js.map",
|
||||
"static/js/1.08295283.chunk.js": "static/js/1.08295283.chunk.js",
|
||||
"static/js/1.08295283.chunk.js.map": "static/js/1.08295283.chunk.js.map",
|
||||
"static/js/10.27f188c7.chunk.js": "static/js/10.27f188c7.chunk.js",
|
||||
|
|
@ -25,8 +25,8 @@
|
|||
"static/js/15.e804bc91.chunk.js.map": "static/js/15.e804bc91.chunk.js.map",
|
||||
"static/js/16.e084ed27.chunk.js": "static/js/16.e084ed27.chunk.js",
|
||||
"static/js/16.e084ed27.chunk.js.map": "static/js/16.e084ed27.chunk.js.map",
|
||||
"static/js/17.22f52fae.chunk.js": "static/js/17.22f52fae.chunk.js",
|
||||
"static/js/17.22f52fae.chunk.js.map": "static/js/17.22f52fae.chunk.js.map",
|
||||
"static/js/17.d6941427.chunk.js": "static/js/17.d6941427.chunk.js",
|
||||
"static/js/17.d6941427.chunk.js.map": "static/js/17.d6941427.chunk.js.map",
|
||||
"static/js/18.730eeb3b.chunk.js": "static/js/18.730eeb3b.chunk.js",
|
||||
"static/js/18.730eeb3b.chunk.js.map": "static/js/18.730eeb3b.chunk.js.map",
|
||||
"static/js/19.e37070eb.chunk.js": "static/js/19.e37070eb.chunk.js",
|
||||
|
|
@ -37,8 +37,8 @@
|
|||
"static/js/20.7729a37c.chunk.js.map": "static/js/20.7729a37c.chunk.js.map",
|
||||
"static/js/21.4551715a.chunk.js": "static/js/21.4551715a.chunk.js",
|
||||
"static/js/21.4551715a.chunk.js.map": "static/js/21.4551715a.chunk.js.map",
|
||||
"static/js/22.de295c38.chunk.js": "static/js/22.de295c38.chunk.js",
|
||||
"static/js/22.de295c38.chunk.js.map": "static/js/22.de295c38.chunk.js.map",
|
||||
"static/js/22.016f3201.chunk.js": "static/js/22.016f3201.chunk.js",
|
||||
"static/js/22.016f3201.chunk.js.map": "static/js/22.016f3201.chunk.js.map",
|
||||
"static/js/23.1f4e3bc1.chunk.js": "static/js/23.1f4e3bc1.chunk.js",
|
||||
"static/js/23.1f4e3bc1.chunk.js.map": "static/js/23.1f4e3bc1.chunk.js.map",
|
||||
"static/js/24.d7ad68dc.chunk.js": "static/js/24.d7ad68dc.chunk.js",
|
||||
|
|
@ -61,8 +61,8 @@
|
|||
"static/js/31.55b81de7.chunk.js.map": "static/js/31.55b81de7.chunk.js.map",
|
||||
"static/js/4.4af8cac5.chunk.js": "static/js/4.4af8cac5.chunk.js",
|
||||
"static/js/4.4af8cac5.chunk.js.map": "static/js/4.4af8cac5.chunk.js.map",
|
||||
"static/js/5.11c3842c.chunk.js": "static/js/5.11c3842c.chunk.js",
|
||||
"static/js/5.11c3842c.chunk.js.map": "static/js/5.11c3842c.chunk.js.map",
|
||||
"static/js/5.cbce913c.chunk.js": "static/js/5.cbce913c.chunk.js",
|
||||
"static/js/5.cbce913c.chunk.js.map": "static/js/5.cbce913c.chunk.js.map",
|
||||
"static/js/6.0c7fe731.chunk.js": "static/js/6.0c7fe731.chunk.js",
|
||||
"static/js/6.0c7fe731.chunk.js.map": "static/js/6.0c7fe731.chunk.js.map",
|
||||
"static/js/7.106d7946.chunk.js": "static/js/7.106d7946.chunk.js",
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="shortcut icon" href="./favicon.ico"><link rel="stylesheet" href="./highlight/prism.css"><style>*{-webkit-tap-highlight-color:rgba(255,255,255,0);-moz-user-focus:none}</style><title>Omi - Next Front End Framework</title><link href="./static/css/cn.4dd07f49.css" rel="stylesheet"></head><body><script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-shim.min.js"></script><script src="./highlight/prism.js"></script><script src="./js/remarkable.min.js"></script><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script type="text/javascript" src="./static/js/cn.ac61e6ce.js"></script></body></html>
|
||||
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="shortcut icon" href="./favicon.ico"><link rel="stylesheet" href="./highlight/prism.css"><style>*{-webkit-tap-highlight-color:rgba(255,255,255,0);-moz-user-focus:none}</style><title>Omi - Next Front End Framework</title><link href="./static/css/cn.4dd07f49.css" rel="stylesheet"></head><body><script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-shim.min.js"></script><script src="./highlight/prism.js"></script><script src="./js/remarkable.min.js"></script><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script type="text/javascript" src="./static/js/cn.c4d9a6a3.js"></script></body></html>
|
||||
|
|
@ -1 +1 @@
|
|||
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="shortcut icon" href="./favicon.ico"><link rel="stylesheet" href="./highlight/prism.css"><style>*{-webkit-tap-highlight-color:rgba(255,255,255,0);-moz-user-focus:none}</style><title>Omi - Next Front End Framework</title><link href="./static/css/index.4dd07f49.css" rel="stylesheet"></head><body><script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-shim.min.js"></script><script src="./highlight/prism.js"></script><script src="./js/remarkable.min.js"></script><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script type="text/javascript" src="./static/js/index.b0a09b3e.js"></script></body></html>
|
||||
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="shortcut icon" href="./favicon.ico"><link rel="stylesheet" href="./highlight/prism.css"><style>*{-webkit-tap-highlight-color:rgba(255,255,255,0);-moz-user-focus:none}</style><title>Omi - Next Front End Framework</title><link href="./static/css/index.4dd07f49.css" rel="stylesheet"></head><body><script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-shim.min.js"></script><script src="./highlight/prism.js"></script><script src="./js/remarkable.min.js"></script><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script type="text/javascript" src="./static/js/index.4980fddd.js"></script></body></html>
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,2 +1,2 @@
|
|||
webpackJsonp([0],{70:function(n,t){n.exports="\n## Update\n\n`update` \u65b9\u6cd5\u662f\u5185\u7f6e\u7684\u91cd\u8981\u6838\u5fc3\u65b9\u6cd5\uff0c\u7528\u4e8e\u66f4\u65b0\u7ec4\u4ef6\u81ea\u8eab\u3002\u6bd4\u5982:\n\n```js\nthis.update()\n```\n\n\u4e5f\u53ef\u4ee5\u4f20\u9012\u53c2\u6570\uff0c\u51b3\u5b9a\u662f\u5426\u5ffd\u7565 attributes\uff0c\u5f3a\u884c\u66f4\u65b0:\n\n```js\nthis.update(true)\n```\n\n\u4e3e\u4e2a\u573a\u666f\uff0c\u6bd4\u5982\u70b9\u51fb\u5f39\u51fa\u5c42\u7684 mask \u5173\u95ed\u5f39\u51fa\uff0c\u5728 react \u4e2d\u9700\u8981\u4f20\u9012\u7ed9\u7236\u7ec4\u4ef6\uff0c\u8ba9\u7236\u7ec4\u4ef6\u66f4\u65b0\uff0c\u800c Omi \u63a8\u5d07\u81ea\u66f4\u65b0\uff0c\u8fd9\u6837 diff \u7684\u533a\u57df\u66f4\u5c0f\u3002\n\n```js\nonMaskClick = ()=> {\n //\u4fee\u590d props\n this.props.show = false\n //\u5ffd\u7565 attributes\n this.update(true)\n //\u89e6\u53d1\u4e8b\u4ef6\uff0c\u53ef\u4ee5\u901a\u8fc7\u8fd9\u4e2a\u66f4\u6539\u5916\u90e8\u7684\u72b6\u6001\u53d8\u91cf\u6765\u4fdd\u6301\u4e00\u81f4\u6027\uff0c\u4f46\u662f\u5916\u9762\u7684\u7ec4\u4ef6\u4e0d\u7528\u518d\u66f4\u65b0\n this.fire('close')\n}\n```"}});
|
||||
//# sourceMappingURL=0.f6b49677.chunk.js.map
|
||||
webpackJsonp([0],{70:function(n,s){n.exports="\n## Update\n\n`update` \u65b9\u6cd5\u662f\u5185\u7f6e\u7684\u91cd\u8981\u6838\u5fc3\u65b9\u6cd5\uff0c\u7528\u4e8e\u66f4\u65b0\u7ec4\u4ef6\u81ea\u8eab\u3002\u6bd4\u5982:\n\n```js\nthis.update()\n```\n\n\u4e5f\u53ef\u4ee5\u4f20\u9012\u53c2\u6570\uff0c\u51b3\u5b9a\u662f\u5426\u5ffd\u7565 attributes\uff0c\u5f3a\u884c\u66f4\u65b0:\n\n```js\nthis.update(true)\n```\n\n\u4e3e\u4e2a\u573a\u666f\uff0c\u6bd4\u5982\u70b9\u51fb\u5f39\u51fa\u5c42\u7684 mask \u5173\u95ed\u5f39\u51fa\uff0c\u5728 react \u4e2d\u9700\u8981\u4f20\u9012\u7ed9\u7236\u7ec4\u4ef6\uff0c\u8ba9\u7236\u7ec4\u4ef6\u66f4\u65b0\uff0c\u800c Omi \u63a8\u5d07\u81ea\u66f4\u65b0\uff0c\u8fd9\u6837 diff \u7684\u533a\u57df\u66f4\u5c0f\u3002\n\n```js\nonMaskClick = ()=> {\n //\u4fee\u590d props\n this.props.show = false\n //\u9632\u6b62\u7236\u7ec4\u4ef6\u66f4\u65b0 diff \u4e0d\u51fa\u7ed3\u679c\n this.prevProps.show = false\n //\u66f4\u65b0\uff0c\u5e76\u4e14\u518d html \u6a21\u5f0f\u4e0b\u5ffd\u7565 attributes\n this.update(true)\n //\u89e6\u53d1\u4e8b\u4ef6\uff0c\u53ef\u4ee5\u901a\u8fc7\u8fd9\u4e2a\u66f4\u6539\u5916\u90e8\u7684\u72b6\u6001\u53d8\u91cf\u6765\u4fdd\u6301\u4e00\u81f4\u6027\uff0c\u4f46\u662f\u5916\u9762\u7684\u7ec4\u4ef6\u4e0d\u7528\u518d\u66f4\u65b0\n this.fire('close')\n}\n```"}});
|
||||
//# sourceMappingURL=0.9d92ee7d.chunk.js.map
|
||||
|
|
@ -0,0 +1 @@
|
|||
{"version":3,"sources":["../static/js/0.9d92ee7d.chunk.js","docs/zh-cn/update.md"],"names":["webpackJsonp","70","module","exports"],"mappings":"AAAAA,cAAc,IAERC,GACA,SAAUC,EAAQC,GCHxBD,EAAAC,QAAA","file":"static/js/0.9d92ee7d.chunk.js","sourcesContent":["webpackJsonp([0],{\n\n/***/ 70:\n/***/ (function(module, exports) {\n\nmodule.exports = \"\\n## Update\\n\\n`update` 方法是内置的重要核心方法，用于更新组件自身。比如:\\n\\n```js\\nthis.update()\\n```\\n\\n也可以传递参数，决定是否忽略 attributes，强行更新:\\n\\n```js\\nthis.update(true)\\n```\\n\\n举个场景，比如点击弹出层的 mask 关闭弹出，在 react 中需要传递给父组件，让父组件更新，而 Omi 推崇自更新，这样 diff 的区域更小。\\n\\n```js\\nonMaskClick = ()=> {\\n //修复 props\\n this.props.show = false\\n //防止父组件更新 diff 不出结果\\n this.prevProps.show = false\\n //更新，并且再 html 模式下忽略 attributes\\n this.update(true)\\n //触发事件，可以通过这个更改外部的状态变量来保持一致性，但是外面的组件不用再更新\\n this.fire('close')\\n}\\n```\"\n\n/***/ })\n\n});\n\n\n// WEBPACK FOOTER //\n// static/js/0.9d92ee7d.chunk.js","module.exports = \"\\n## Update\\n\\n`update` 方法是内置的重要核心方法，用于更新组件自身。比如:\\n\\n```js\\nthis.update()\\n```\\n\\n也可以传递参数，决定是否忽略 attributes，强行更新:\\n\\n```js\\nthis.update(true)\\n```\\n\\n举个场景，比如点击弹出层的 mask 关闭弹出，在 react 中需要传递给父组件，让父组件更新，而 Omi 推崇自更新，这样 diff 的区域更小。\\n\\n```js\\nonMaskClick = ()=> {\\n //修复 props\\n this.props.show = false\\n //防止父组件更新 diff 不出结果\\n this.prevProps.show = false\\n //更新，并且再 html 模式下忽略 attributes\\n this.update(true)\\n //触发事件，可以通过这个更改外部的状态变量来保持一致性，但是外面的组件不用再更新\\n this.fire('close')\\n}\\n```\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/docs/zh-cn/update.md\n// module id = 70\n// module chunks = 0"],"sourceRoot":""}
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sources":["../static/js/0.f6b49677.chunk.js","docs/zh-cn/update.md"],"names":["webpackJsonp","70","module","exports"],"mappings":"AAAAA,cAAc,IAERC,GACA,SAAUC,EAAQC,GCHxBD,EAAAC,QAAA","file":"static/js/0.f6b49677.chunk.js","sourcesContent":["webpackJsonp([0],{\n\n/***/ 70:\n/***/ (function(module, exports) {\n\nmodule.exports = \"\\n## Update\\n\\n`update` 方法是内置的重要核心方法，用于更新组件自身。比如:\\n\\n```js\\nthis.update()\\n```\\n\\n也可以传递参数，决定是否忽略 attributes，强行更新:\\n\\n```js\\nthis.update(true)\\n```\\n\\n举个场景，比如点击弹出层的 mask 关闭弹出，在 react 中需要传递给父组件，让父组件更新，而 Omi 推崇自更新，这样 diff 的区域更小。\\n\\n```js\\nonMaskClick = ()=> {\\n //修复 props\\n this.props.show = false\\n //忽略 attributes\\n this.update(true)\\n //触发事件，可以通过这个更改外部的状态变量来保持一致性，但是外面的组件不用再更新\\n this.fire('close')\\n}\\n```\"\n\n/***/ })\n\n});\n\n\n// WEBPACK FOOTER //\n// static/js/0.f6b49677.chunk.js","module.exports = \"\\n## Update\\n\\n`update` 方法是内置的重要核心方法，用于更新组件自身。比如:\\n\\n```js\\nthis.update()\\n```\\n\\n也可以传递参数，决定是否忽略 attributes，强行更新:\\n\\n```js\\nthis.update(true)\\n```\\n\\n举个场景，比如点击弹出层的 mask 关闭弹出，在 react 中需要传递给父组件，让父组件更新，而 Omi 推崇自更新，这样 diff 的区域更小。\\n\\n```js\\nonMaskClick = ()=> {\\n //修复 props\\n this.props.show = false\\n //忽略 attributes\\n this.update(true)\\n //触发事件，可以通过这个更改外部的状态变量来保持一致性，但是外面的组件不用再更新\\n this.fire('close')\\n}\\n```\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/docs/zh-cn/update.md\n// module id = 70\n// module chunks = 0"],"sourceRoot":""}
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sources":["../static/js/17.22f52fae.chunk.js","docs/en/update.md"],"names":["webpackJsonp","53","module","exports"],"mappings":"AAAAA,cAAc,KAERC,GACA,SAAUC,EAAQC,GCHxBD,EAAAC,QAAA","file":"static/js/17.22f52fae.chunk.js","sourcesContent":["webpackJsonp([17],{\n\n/***/ 53:\n/***/ (function(module, exports) {\n\nmodule.exports = \"\\n## Update\\n\\n`update` method is an important built-in core method for updating components themselves. For example:\\n\\n```js\\nthis.update()\\n```\\n\\nYou can also pass parameters to decide whether to ignore attributes and force updates:\\n\\n```js\\nthis.update(true)\\n```\\n\\nFor example, click on the mask of the pop-up layer to close the pop-up, pass it to the parent component in the react, let the parent component update, while Omi advocates self-update, so that the diff area is smaller.\\n\\n```js\\nonMaskClick = ()=> {\\n //change props\\n this.props.show = false\\n //ignore attributes\\n this.update(true)\\n //trigger events, which can be used to change external state variables to maintain consistency, but external components need not be updated\\n this.fire('close')\\n}\\n```\"\n\n/***/ })\n\n});\n\n\n// WEBPACK FOOTER //\n// static/js/17.22f52fae.chunk.js","module.exports = \"\\n## Update\\n\\n`update` method is an important built-in core method for updating components themselves. For example:\\n\\n```js\\nthis.update()\\n```\\n\\nYou can also pass parameters to decide whether to ignore attributes and force updates:\\n\\n```js\\nthis.update(true)\\n```\\n\\nFor example, click on the mask of the pop-up layer to close the pop-up, pass it to the parent component in the react, let the parent component update, while Omi advocates self-update, so that the diff area is smaller.\\n\\n```js\\nonMaskClick = ()=> {\\n //change props\\n this.props.show = false\\n //ignore attributes\\n this.update(true)\\n //trigger events, which can be used to change external state variables to maintain consistency, but external components need not be updated\\n this.fire('close')\\n}\\n```\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/docs/en/update.md\n// module id = 53\n// module chunks = 17"],"sourceRoot":""}
|
||||
|
|
@ -1,2 +1,2 @@
|
|||
webpackJsonp([17],{53:function(e,t){e.exports="\n## Update\n\n`update` method is an important built-in core method for updating components themselves. For example:\n\n```js\nthis.update()\n```\n\nYou can also pass parameters to decide whether to ignore attributes and force updates:\n\n```js\nthis.update(true)\n```\n\nFor example, click on the mask of the pop-up layer to close the pop-up, pass it to the parent component in the react, let the parent component update, while Omi advocates self-update, so that the diff area is smaller.\n\n```js\nonMaskClick = ()=> {\n //change props\n this.props.show = false\n //ignore attributes\n this.update(true)\n //trigger events, which can be used to change external state variables to maintain consistency, but external components need not be updated\n this.fire('close')\n}\n```"}});
|
||||
//# sourceMappingURL=17.22f52fae.chunk.js.map
|
||||
webpackJsonp([17],{53:function(e,t){e.exports="\n## Update\n\n`update` method is an important built-in core method for updating components themselves. For example:\n\n```js\nthis.update()\n```\n\nYou can also pass parameters to decide whether to ignore attributes and force updates:\n\n```js\nthis.update(true)\n```\n\nFor example, click on the mask of the pop-up layer to close the pop-up, pass it to the parent component in the react, let the parent component update, while Omi advocates self-update, so that the diff area is smaller.\n\n```js\nonMaskClick = ()=> {\n //change props\n this.props.show = false\n //prevent parent component from updating diff without results\n this.prevProps.show = false\n //update self and ignore attributes in html mode\n this.update(true)\n //trigger events, which can be used to change external state variables to maintain consistency, but external components need not be updated\n this.fire('close')\n}\n```"}});
|
||||
//# sourceMappingURL=17.d6941427.chunk.js.map
|
||||
|
|
@ -0,0 +1 @@
|
|||
{"version":3,"sources":["../static/js/17.d6941427.chunk.js","docs/en/update.md"],"names":["webpackJsonp","53","module","exports"],"mappings":"AAAAA,cAAc,KAERC,GACA,SAAUC,EAAQC,GCHxBD,EAAAC,QAAA","file":"static/js/17.d6941427.chunk.js","sourcesContent":["webpackJsonp([17],{\n\n/***/ 53:\n/***/ (function(module, exports) {\n\nmodule.exports = \"\\n## Update\\n\\n`update` method is an important built-in core method for updating components themselves. For example:\\n\\n```js\\nthis.update()\\n```\\n\\nYou can also pass parameters to decide whether to ignore attributes and force updates:\\n\\n```js\\nthis.update(true)\\n```\\n\\nFor example, click on the mask of the pop-up layer to close the pop-up, pass it to the parent component in the react, let the parent component update, while Omi advocates self-update, so that the diff area is smaller.\\n\\n```js\\nonMaskClick = ()=> {\\n //change props\\n this.props.show = false\\n //prevent parent component from updating diff without results\\n this.prevProps.show = false\\n //update self and ignore attributes in html mode\\n this.update(true)\\n //trigger events, which can be used to change external state variables to maintain consistency, but external components need not be updated\\n this.fire('close')\\n}\\n```\"\n\n/***/ })\n\n});\n\n\n// WEBPACK FOOTER //\n// static/js/17.d6941427.chunk.js","module.exports = \"\\n## Update\\n\\n`update` method is an important built-in core method for updating components themselves. For example:\\n\\n```js\\nthis.update()\\n```\\n\\nYou can also pass parameters to decide whether to ignore attributes and force updates:\\n\\n```js\\nthis.update(true)\\n```\\n\\nFor example, click on the mask of the pop-up layer to close the pop-up, pass it to the parent component in the react, let the parent component update, while Omi advocates self-update, so that the diff area is smaller.\\n\\n```js\\nonMaskClick = ()=> {\\n //change props\\n this.props.show = false\\n //prevent parent component from updating diff without results\\n this.prevProps.show = false\\n //update self and ignore attributes in html mode\\n this.update(true)\\n //trigger events, which can be used to change external state variables to maintain consistency, but external components need not be updated\\n this.fire('close')\\n}\\n```\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/docs/en/update.md\n// module id = 53\n// module chunks = 17"],"sourceRoot":""}
|
||||
|
|
@ -1,2 +1,2 @@
|
|||
webpackJsonp([22],{48:function(e,n){e.exports="\n## Props\n\nTransfer data to sub elements through props, such as:\n\n```jsx\nimport { WeElement, define, render } from 'omi'\n\ndefine('my-element', class extends WeElement {\n render(props) {\n return (\n <h1>Hello, {props.name}!</h1>\n )\n }\n})\n```\n\nUsing element:\n\n```jsx\n<my-element name=\"world\"></my-element>\n```\n\nYou can also pass any type of data to props:\n\n```jsx\ndefine('my-element', class extends WeElement {\n render(props) {\n return (\n <h1>Hello, {props.myObj.name}!</h1>\n )\n }\n})\n```\n\nUsing element:\n\n```jsx\n<my-element myObj={{ name: 'world' }}></my-element>\n```\n\nYou can set the default value by the `static defaultProps` property\uff0cuse `static propTypes` to set the type:\n\n```jsx\ndefine('my-element', class extends WeElement {\n static defaultProps = {\n\t\tname: 'Omi',\n\t\tmyAge: 18\n\t}\n\n static propTypes = {\n\t\tname: String,\n\t\tmyAge: Number\n }\n \n render(props) {\n return (\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\n )\n }\n})\n```\n\nSpecial attention should be paid to adding `static propTypes` if your custom elements want to be used directly in other frameworks or without frameworks. For example, it can be used directly in the body:\n\n```html\n<body>\n <my-element name=\"dntzhang\" my-age=\"20\"></my-element>\n</body>\n```"}});
|
||||
//# sourceMappingURL=22.de295c38.chunk.js.map
|
||||
webpackJsonp([22],{48:function(n,e){n.exports="\n## Props\n\nTransfer data to sub elements through props, such as:\n\n```jsx\nimport { WeElement, define, render } from 'omi'\n\ndefine('my-element', class extends WeElement {\n render(props) {\n return (\n <h1>Hello, {props.name}!</h1>\n )\n }\n})\n```\n\nUsing element:\n\n```jsx\n<my-element name=\"world\"></my-element>\n```\n\nYou can also pass any type of data to props:\n\n```jsx\ndefine('my-element', class extends WeElement {\n render(props) {\n return (\n <h1>Hello, {props.myObj.name}!</h1>\n )\n }\n})\n```\n\nUsing element:\n\n```jsx\n<my-element myObj={{ name: 'world' }}></my-element>\n```\n\nYou can set the default value by the `static defaultProps` property\uff0cuse `static propTypes` to set the type:\n\n```jsx\ndefine('my-element', class extends WeElement {\n static defaultProps = {\n\t\tname: 'Omi',\n\t\tmyAge: 18\n\t}\n\n static propTypes = {\n\t\tname: String,\n\t\tmyAge: Number\n }\n \n render(props) {\n return (\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\n )\n }\n})\n```\n\nSpecial attention should be paid to adding `static propTypes` if your custom elements want to be used directly in other frameworks or without frameworks. For example, it can be used directly in the body:\n\n```html\n<body>\n <my-element name=\"dntzhang\" my-age=\"20\"></my-element>\n</body>\n```\n\n### Once Props\n\n```jsx\ndefine('my-element', class extends WeElement {\n install() {\n this.name = this.props.name\n }\n\n render() {\n return (\n <h1>Hello, {this.name}!</h1>\n )\n }\n})\n```\n\nNext time the parent component updated and changed props, it will not affect the component."}});
|
||||
//# sourceMappingURL=22.016f3201.chunk.js.map
|
||||
|
|
@ -0,0 +1 @@
|
|||
{"version":3,"sources":["../static/js/22.016f3201.chunk.js","docs/en/props.md"],"names":["webpackJsonp","48","module","exports"],"mappings":"AAAAA,cAAc,KAERC,GACA,SAAUC,EAAQC,GCHxBD,EAAAC,QAAA","file":"static/js/22.016f3201.chunk.js","sourcesContent":["webpackJsonp([22],{\n\n/***/ 48:\n/***/ (function(module, exports) {\n\nmodule.exports = \"\\n## Props\\n\\nTransfer data to sub elements through props, such as:\\n\\n```jsx\\nimport { WeElement, define, render } from 'omi'\\n\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nUsing element:\\n\\n```jsx\\n<my-element name=\\\"world\\\"></my-element>\\n```\\n\\nYou can also pass any type of data to props:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.myObj.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nUsing element:\\n\\n```jsx\\n<my-element myObj={{ name: 'world' }}></my-element>\\n```\\n\\nYou can set the default value by the `static defaultProps` property，use `static propTypes` to set the type:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n static defaultProps = {\\n\\t\\tname: 'Omi',\\n\\t\\tmyAge: 18\\n\\t}\\n\\n static propTypes = {\\n\\t\\tname: String,\\n\\t\\tmyAge: Number\\n }\\n \\n render(props) {\\n return (\\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\\n )\\n }\\n})\\n```\\n\\nSpecial attention should be paid to adding `static propTypes` if your custom elements want to be used directly in other frameworks or without frameworks. For example, it can be used directly in the body:\\n\\n```html\\n<body>\\n <my-element name=\\\"dntzhang\\\" my-age=\\\"20\\\"></my-element>\\n</body>\\n```\\n\\n### Once Props\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n install() {\\n this.name = this.props.name\\n }\\n\\n render() {\\n return (\\n <h1>Hello, {this.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nNext time the parent component updated and changed props, it will not affect the component.\"\n\n/***/ })\n\n});\n\n\n// WEBPACK FOOTER //\n// static/js/22.016f3201.chunk.js","module.exports = \"\\n## Props\\n\\nTransfer data to sub elements through props, such as:\\n\\n```jsx\\nimport { WeElement, define, render } from 'omi'\\n\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nUsing element:\\n\\n```jsx\\n<my-element name=\\\"world\\\"></my-element>\\n```\\n\\nYou can also pass any type of data to props:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.myObj.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nUsing element:\\n\\n```jsx\\n<my-element myObj={{ name: 'world' }}></my-element>\\n```\\n\\nYou can set the default value by the `static defaultProps` property，use `static propTypes` to set the type:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n static defaultProps = {\\n\\t\\tname: 'Omi',\\n\\t\\tmyAge: 18\\n\\t}\\n\\n static propTypes = {\\n\\t\\tname: String,\\n\\t\\tmyAge: Number\\n }\\n \\n render(props) {\\n return (\\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\\n )\\n }\\n})\\n```\\n\\nSpecial attention should be paid to adding `static propTypes` if your custom elements want to be used directly in other frameworks or without frameworks. For example, it can be used directly in the body:\\n\\n```html\\n<body>\\n <my-element name=\\\"dntzhang\\\" my-age=\\\"20\\\"></my-element>\\n</body>\\n```\\n\\n### Once Props\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n install() {\\n this.name = this.props.name\\n }\\n\\n render() {\\n return (\\n <h1>Hello, {this.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nNext time the parent component updated and changed props, it will not affect the component.\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/docs/en/props.md\n// module id = 48\n// module chunks = 22"],"sourceRoot":""}
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sources":["../static/js/22.de295c38.chunk.js","docs/en/props.md"],"names":["webpackJsonp","48","module","exports"],"mappings":"AAAAA,cAAc,KAERC,GACA,SAAUC,EAAQC,GCHxBD,EAAAC,QAAA","file":"static/js/22.de295c38.chunk.js","sourcesContent":["webpackJsonp([22],{\n\n/***/ 48:\n/***/ (function(module, exports) {\n\nmodule.exports = \"\\n## Props\\n\\nTransfer data to sub elements through props, such as:\\n\\n```jsx\\nimport { WeElement, define, render } from 'omi'\\n\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nUsing element:\\n\\n```jsx\\n<my-element name=\\\"world\\\"></my-element>\\n```\\n\\nYou can also pass any type of data to props:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.myObj.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nUsing element:\\n\\n```jsx\\n<my-element myObj={{ name: 'world' }}></my-element>\\n```\\n\\nYou can set the default value by the `static defaultProps` property，use `static propTypes` to set the type:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n static defaultProps = {\\n\\t\\tname: 'Omi',\\n\\t\\tmyAge: 18\\n\\t}\\n\\n static propTypes = {\\n\\t\\tname: String,\\n\\t\\tmyAge: Number\\n }\\n \\n render(props) {\\n return (\\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\\n )\\n }\\n})\\n```\\n\\nSpecial attention should be paid to adding `static propTypes` if your custom elements want to be used directly in other frameworks or without frameworks. For example, it can be used directly in the body:\\n\\n```html\\n<body>\\n <my-element name=\\\"dntzhang\\\" my-age=\\\"20\\\"></my-element>\\n</body>\\n```\"\n\n/***/ })\n\n});\n\n\n// WEBPACK FOOTER //\n// static/js/22.de295c38.chunk.js","module.exports = \"\\n## Props\\n\\nTransfer data to sub elements through props, such as:\\n\\n```jsx\\nimport { WeElement, define, render } from 'omi'\\n\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nUsing element:\\n\\n```jsx\\n<my-element name=\\\"world\\\"></my-element>\\n```\\n\\nYou can also pass any type of data to props:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.myObj.name}!</h1>\\n )\\n }\\n})\\n```\\n\\nUsing element:\\n\\n```jsx\\n<my-element myObj={{ name: 'world' }}></my-element>\\n```\\n\\nYou can set the default value by the `static defaultProps` property，use `static propTypes` to set the type:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n static defaultProps = {\\n\\t\\tname: 'Omi',\\n\\t\\tmyAge: 18\\n\\t}\\n\\n static propTypes = {\\n\\t\\tname: String,\\n\\t\\tmyAge: Number\\n }\\n \\n render(props) {\\n return (\\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\\n )\\n }\\n})\\n```\\n\\nSpecial attention should be paid to adding `static propTypes` if your custom elements want to be used directly in other frameworks or without frameworks. For example, it can be used directly in the body:\\n\\n```html\\n<body>\\n <my-element name=\\\"dntzhang\\\" my-age=\\\"20\\\"></my-element>\\n</body>\\n```\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/docs/en/props.md\n// module id = 48\n// module chunks = 22"],"sourceRoot":""}
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sources":["../static/js/5.11c3842c.chunk.js","docs/zh-cn/props.md"],"names":["webpackJsonp","65","module","exports"],"mappings":"AAAAA,cAAc,IAERC,GACA,SAAUC,EAAQC,GCHxBD,EAAAC,QAAA","file":"static/js/5.11c3842c.chunk.js","sourcesContent":["webpackJsonp([5],{\n\n/***/ 65:\n/***/ (function(module, exports) {\n\nmodule.exports = \"\\n## Props\\n\\n通过 Props 向子组件传递数据，比如：\\n\\n```jsx\\nimport { WeElement, define, render } from 'omi'\\n\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n使用元素:\\n\\n```jsx\\n<my-element name=\\\"world\\\"></my-element>\\n```\\n\\n你也可以传任意类型的数据给 props:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.myObj.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n使用元素:\\n\\n```jsx\\n<my-element myObj={{ name: 'world' }}></my-element>\\n```\\n\\n你可以通过静态属性 `static defaultProps` 来设置默认值，使用 `static propTypes` 来设置类型:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n static defaultProps = {\\n\\t\\tname: 'Omi',\\n\\t\\tmyAge: 18\\n }\\n \\n static propTypes = {\\n\\t\\tname: String,\\n\\t\\tmyAge: Number\\n\\t}\\n\\n render(props) {\\n return (\\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\\n )\\n }\\n})\\n```\\n\\n需要特别注意，如果你的自定义元素想要直接在其他框架或者无框架的情况下原生使用，请一定要加上 `static propTypes` 才能生效。比如，这样就可以直接在 body 中使用:\\n\\n```html\\n<body>\\n <my-element name=\\\"dntzhang\\\" my-age=\\\"20\\\"></my-element>\\n</body>\\n```\"\n\n/***/ })\n\n});\n\n\n// WEBPACK FOOTER //\n// static/js/5.11c3842c.chunk.js","module.exports = \"\\n## Props\\n\\n通过 Props 向子组件传递数据，比如：\\n\\n```jsx\\nimport { WeElement, define, render } from 'omi'\\n\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n使用元素:\\n\\n```jsx\\n<my-element name=\\\"world\\\"></my-element>\\n```\\n\\n你也可以传任意类型的数据给 props:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.myObj.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n使用元素:\\n\\n```jsx\\n<my-element myObj={{ name: 'world' }}></my-element>\\n```\\n\\n你可以通过静态属性 `static defaultProps` 来设置默认值，使用 `static propTypes` 来设置类型:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n static defaultProps = {\\n\\t\\tname: 'Omi',\\n\\t\\tmyAge: 18\\n }\\n \\n static propTypes = {\\n\\t\\tname: String,\\n\\t\\tmyAge: Number\\n\\t}\\n\\n render(props) {\\n return (\\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\\n )\\n }\\n})\\n```\\n\\n需要特别注意，如果你的自定义元素想要直接在其他框架或者无框架的情况下原生使用，请一定要加上 `static propTypes` 才能生效。比如，这样就可以直接在 body 中使用:\\n\\n```html\\n<body>\\n <my-element name=\\\"dntzhang\\\" my-age=\\\"20\\\"></my-element>\\n</body>\\n```\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/docs/zh-cn/props.md\n// module id = 65\n// module chunks = 5"],"sourceRoot":""}
|
||||
|
|
@ -1,2 +1,2 @@
|
|||
webpackJsonp([5],{65:function(n,e){n.exports="\n## Props\n\n\u901a\u8fc7 Props \u5411\u5b50\u7ec4\u4ef6\u4f20\u9012\u6570\u636e\uff0c\u6bd4\u5982\uff1a\n\n```jsx\nimport { WeElement, define, render } from 'omi'\n\ndefine('my-element', class extends WeElement {\n render(props) {\n return (\n <h1>Hello, {props.name}!</h1>\n )\n }\n})\n```\n\n\u4f7f\u7528\u5143\u7d20:\n\n```jsx\n<my-element name=\"world\"></my-element>\n```\n\n\u4f60\u4e5f\u53ef\u4ee5\u4f20\u4efb\u610f\u7c7b\u578b\u7684\u6570\u636e\u7ed9 props:\n\n```jsx\ndefine('my-element', class extends WeElement {\n render(props) {\n return (\n <h1>Hello, {props.myObj.name}!</h1>\n )\n }\n})\n```\n\n\u4f7f\u7528\u5143\u7d20:\n\n```jsx\n<my-element myObj={{ name: 'world' }}></my-element>\n```\n\n\u4f60\u53ef\u4ee5\u901a\u8fc7\u9759\u6001\u5c5e\u6027 `static defaultProps` \u6765\u8bbe\u7f6e\u9ed8\u8ba4\u503c\uff0c\u4f7f\u7528 `static propTypes` \u6765\u8bbe\u7f6e\u7c7b\u578b:\n\n```jsx\ndefine('my-element', class extends WeElement {\n static defaultProps = {\n\t\tname: 'Omi',\n\t\tmyAge: 18\n }\n \n static propTypes = {\n\t\tname: String,\n\t\tmyAge: Number\n\t}\n\n render(props) {\n return (\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\n )\n }\n})\n```\n\n\u9700\u8981\u7279\u522b\u6ce8\u610f\uff0c\u5982\u679c\u4f60\u7684\u81ea\u5b9a\u4e49\u5143\u7d20\u60f3\u8981\u76f4\u63a5\u5728\u5176\u4ed6\u6846\u67b6\u6216\u8005\u65e0\u6846\u67b6\u7684\u60c5\u51b5\u4e0b\u539f\u751f\u4f7f\u7528\uff0c\u8bf7\u4e00\u5b9a\u8981\u52a0\u4e0a `static propTypes` \u624d\u80fd\u751f\u6548\u3002\u6bd4\u5982\uff0c\u8fd9\u6837\u5c31\u53ef\u4ee5\u76f4\u63a5\u5728 body \u4e2d\u4f7f\u7528:\n\n```html\n<body>\n <my-element name=\"dntzhang\" my-age=\"20\"></my-element>\n</body>\n```"}});
|
||||
//# sourceMappingURL=5.11c3842c.chunk.js.map
|
||||
webpackJsonp([5],{65:function(n,e){n.exports="\n## Props\n\n\u901a\u8fc7 Props \u5411\u5b50\u7ec4\u4ef6\u4f20\u9012\u6570\u636e\uff0c\u6bd4\u5982\uff1a\n\n```jsx\nimport { WeElement, define, render } from 'omi'\n\ndefine('my-element', class extends WeElement {\n render(props) {\n return (\n <h1>Hello, {props.name}!</h1>\n )\n }\n})\n```\n\n\u4f7f\u7528\u5143\u7d20:\n\n```jsx\n<my-element name=\"world\"></my-element>\n```\n\n\u4f60\u4e5f\u53ef\u4ee5\u4f20\u4efb\u610f\u7c7b\u578b\u7684\u6570\u636e\u7ed9 props:\n\n```jsx\ndefine('my-element', class extends WeElement {\n render(props) {\n return (\n <h1>Hello, {props.myObj.name}!</h1>\n )\n }\n})\n```\n\n\u4f7f\u7528\u5143\u7d20:\n\n```jsx\n<my-element myObj={{ name: 'world' }}></my-element>\n```\n\n\u4f60\u53ef\u4ee5\u901a\u8fc7\u9759\u6001\u5c5e\u6027 `static defaultProps` \u6765\u8bbe\u7f6e\u9ed8\u8ba4\u503c\uff0c\u4f7f\u7528 `static propTypes` \u6765\u8bbe\u7f6e\u7c7b\u578b:\n\n```jsx\ndefine('my-element', class extends WeElement {\n static defaultProps = {\n\t\tname: 'Omi',\n\t\tmyAge: 18\n }\n \n static propTypes = {\n\t\tname: String,\n\t\tmyAge: Number\n\t}\n\n render(props) {\n return (\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\n )\n }\n})\n```\n\n\u9700\u8981\u7279\u522b\u6ce8\u610f\uff0c\u5982\u679c\u4f60\u7684\u81ea\u5b9a\u4e49\u5143\u7d20\u60f3\u8981\u76f4\u63a5\u5728\u5176\u4ed6\u6846\u67b6\u6216\u8005\u65e0\u6846\u67b6\u7684\u60c5\u51b5\u4e0b\u539f\u751f\u4f7f\u7528\uff0c\u8bf7\u4e00\u5b9a\u8981\u52a0\u4e0a `static propTypes` \u624d\u80fd\u751f\u6548\u3002\u6bd4\u5982\uff0c\u8fd9\u6837\u5c31\u53ef\u4ee5\u76f4\u63a5\u5728 body \u4e2d\u4f7f\u7528:\n\n```html\n<body>\n <my-element name=\"dntzhang\" my-age=\"20\"></my-element>\n</body>\n```\n\n### \u9ad8\u7ea7\u6280\u5de7\n\n\u8fd9\u91cc\u4ecb\u7ecd\u4e00\u6b21\u6027\u4f7f\u7528 prop \u7684\u6280\u5de7:\n\n```jsx\ndefine('my-element', class extends WeElement {\n install() {\n this.name = this.props.name\n }\n\n render() {\n return (\n <h1>Hello, {this.name}!</h1>\n )\n }\n})\n```\n\n\u4e0b\u6b21\u7236\u7ec4\u4ef6 update \u5e76\u4e14\u4fee\u6539\u4e86 props \u4e5f\u4e0d\u4f1a\u5f71\u54cd\u5230\u8be5\u7ec4\u4ef6\u3002"}});
|
||||
//# sourceMappingURL=5.cbce913c.chunk.js.map
|
||||
|
|
@ -0,0 +1 @@
|
|||
{"version":3,"sources":["../static/js/5.cbce913c.chunk.js","docs/zh-cn/props.md"],"names":["webpackJsonp","65","module","exports"],"mappings":"AAAAA,cAAc,IAERC,GACA,SAAUC,EAAQC,GCHxBD,EAAAC,QAAA","file":"static/js/5.cbce913c.chunk.js","sourcesContent":["webpackJsonp([5],{\n\n/***/ 65:\n/***/ (function(module, exports) {\n\nmodule.exports = \"\\n## Props\\n\\n通过 Props 向子组件传递数据，比如：\\n\\n```jsx\\nimport { WeElement, define, render } from 'omi'\\n\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n使用元素:\\n\\n```jsx\\n<my-element name=\\\"world\\\"></my-element>\\n```\\n\\n你也可以传任意类型的数据给 props:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.myObj.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n使用元素:\\n\\n```jsx\\n<my-element myObj={{ name: 'world' }}></my-element>\\n```\\n\\n你可以通过静态属性 `static defaultProps` 来设置默认值，使用 `static propTypes` 来设置类型:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n static defaultProps = {\\n\\t\\tname: 'Omi',\\n\\t\\tmyAge: 18\\n }\\n \\n static propTypes = {\\n\\t\\tname: String,\\n\\t\\tmyAge: Number\\n\\t}\\n\\n render(props) {\\n return (\\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\\n )\\n }\\n})\\n```\\n\\n需要特别注意，如果你的自定义元素想要直接在其他框架或者无框架的情况下原生使用，请一定要加上 `static propTypes` 才能生效。比如，这样就可以直接在 body 中使用:\\n\\n```html\\n<body>\\n <my-element name=\\\"dntzhang\\\" my-age=\\\"20\\\"></my-element>\\n</body>\\n```\\n\\n### 高级技巧\\n\\n这里介绍一次性使用 prop 的技巧:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n install() {\\n this.name = this.props.name\\n }\\n\\n render() {\\n return (\\n <h1>Hello, {this.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n下次父组件 update 并且修改了 props 也不会影响到该组件。\"\n\n/***/ })\n\n});\n\n\n// WEBPACK FOOTER //\n// static/js/5.cbce913c.chunk.js","module.exports = \"\\n## Props\\n\\n通过 Props 向子组件传递数据，比如：\\n\\n```jsx\\nimport { WeElement, define, render } from 'omi'\\n\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n使用元素:\\n\\n```jsx\\n<my-element name=\\\"world\\\"></my-element>\\n```\\n\\n你也可以传任意类型的数据给 props:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n render(props) {\\n return (\\n <h1>Hello, {props.myObj.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n使用元素:\\n\\n```jsx\\n<my-element myObj={{ name: 'world' }}></my-element>\\n```\\n\\n你可以通过静态属性 `static defaultProps` 来设置默认值，使用 `static propTypes` 来设置类型:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n static defaultProps = {\\n\\t\\tname: 'Omi',\\n\\t\\tmyAge: 18\\n }\\n \\n static propTypes = {\\n\\t\\tname: String,\\n\\t\\tmyAge: Number\\n\\t}\\n\\n render(props) {\\n return (\\n <h1>Hello, {props.name}! Age {props.myAge}</h1>\\n )\\n }\\n})\\n```\\n\\n需要特别注意，如果你的自定义元素想要直接在其他框架或者无框架的情况下原生使用，请一定要加上 `static propTypes` 才能生效。比如，这样就可以直接在 body 中使用:\\n\\n```html\\n<body>\\n <my-element name=\\\"dntzhang\\\" my-age=\\\"20\\\"></my-element>\\n</body>\\n```\\n\\n### 高级技巧\\n\\n这里介绍一次性使用 prop 的技巧:\\n\\n```jsx\\ndefine('my-element', class extends WeElement {\\n install() {\\n this.name = this.props.name\\n }\\n\\n render() {\\n return (\\n <h1>Hello, {this.name}!</h1>\\n )\\n }\\n})\\n```\\n\\n下次父组件 update 并且修改了 props 也不会影响到该组件。\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/docs/zh-cn/props.md\n// module id = 65\n// module chunks = 5"],"sourceRoot":""}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -67,4 +67,22 @@ Special attention should be paid to adding `static propTypes` if your custom ele
|
|||
<body>
|
||||
<my-element name="dntzhang" my-age="20"></my-element>
|
||||
</body>
|
||||
```
|
||||
```
|
||||
|
||||
### Once Props
|
||||
|
||||
```jsx
|
||||
define('my-element', class extends WeElement {
|
||||
install() {
|
||||
this.name = this.props.name
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<h1>Hello, {this.name}!</h1>
|
||||
)
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
Next time the parent component updated and changed props, it will not affect the component.
|
||||
|
|
@ -19,7 +19,9 @@ For example, click on the mask of the pop-up layer to close the pop-up, pass it
|
|||
onMaskClick = ()=> {
|
||||
//change props
|
||||
this.props.show = false
|
||||
//ignore attributes
|
||||
//prevent parent component from updating diff without results
|
||||
this.prevProps.show = false
|
||||
//update self and ignore attributes in html mode
|
||||
this.update(true)
|
||||
//trigger events, which can be used to change external state variables to maintain consistency, but external components need not be updated
|
||||
this.fire('close')
|
||||
|
|
|
|||
|
|
@ -67,4 +67,24 @@ define('my-element', class extends WeElement {
|
|||
<body>
|
||||
<my-element name="dntzhang" my-age="20"></my-element>
|
||||
</body>
|
||||
```
|
||||
```
|
||||
|
||||
### 高级技巧
|
||||
|
||||
这里介绍一次性使用 prop 的技巧:
|
||||
|
||||
```jsx
|
||||
define('my-element', class extends WeElement {
|
||||
install() {
|
||||
this.name = this.props.name
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<h1>Hello, {this.name}!</h1>
|
||||
)
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
下次父组件 update 并且修改了 props 也不会影响到该组件。
|
||||
|
|
@ -19,7 +19,9 @@ this.update(true)
|
|||
onMaskClick = ()=> {
|
||||
//修复 props
|
||||
this.props.show = false
|
||||
//忽略 attributes
|
||||
//防止父组件更新 diff 不出结果
|
||||
this.prevProps.show = false
|
||||
//更新，并且再 html 模式下忽略 attributes
|
||||
this.update(true)
|
||||
//触发事件，可以通过这个更改外部的状态变量来保持一致性，但是外面的组件不用再更新
|
||||
this.fire('close')
|
||||
|
|
|
|||
Loading…
Reference in New Issue