{"id":152,"date":"2022-04-07T17:10:10","date_gmt":"2022-04-07T09:10:10","guid":{"rendered":"https:\/\/reverieland.cn\/?p=152"},"modified":"2022-04-07T17:10:11","modified_gmt":"2022-04-07T09:10:11","slug":"react%e7%9a%84es6%e6%a1%86%e6%9e%b6%e4%b8%8ees5%e7%9b%b8%e6%af%94%e7%9a%84%e4%b8%8d%e5%90%8c","status":"publish","type":"post","link":"https:\/\/reverieland.cn\/index.php\/152\/","title":{"rendered":"React\u7684ES6\u6846\u67b6\u4e0eES5\u76f8\u6bd4\u7684\u4e0d\u540c"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">\u4e00\u3001require\u4e0eimport<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ ES5\r\nvar React = require('react');\r\n \r\n\/\/ ES6\r\nimport React from 'react';<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">\u4e8c\u3001export\u4e0eexports<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ ES5\r\nmodule.exports = Component;\r\n \r\n\/\/ ES6\r\nexport default Component;<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">\u4e09\u3001component\u4e0efunction<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ ES5\r\nvar MyComponent = React.createClass({\r\n    render: function() {\r\n        return\r\n            &lt;h3>Hello Edureka!&lt;\/h3>;\r\n    }\r\n});\r\n \r\n\/\/ ES6\r\nclass MyComponent extends React.Component {\r\n    render() {\r\n        return\r\n            &lt;h3>Hello Edureka!&lt;\/h3>;\r\n    }\r\n}<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">\u56db\u3001props<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ ES5\r\nvar App = React.createClass({\r\n    propTypes: { name: React.PropTypes.string },\r\n    render: function() {\r\n        return\r\n            &lt;h3>Hello, {this.props.name}!&lt;\/h3>;\r\n    }\r\n});\r\n \r\n\/\/ ES6\r\nclass App extends React.Component {\r\n    render() {\r\n        return\r\n            &lt;h3>Hello, {this.props.name}!&lt;\/h3>;\r\n    }\r\n}<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">\u4e94\u3001state<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code> \r\n\/\/ ES5\r\nvar App = React.createClass({\r\n    getInitialState: function() {\r\n        return { name: 'world' };\r\n    },\r\n    render: function() {\r\n        return\r\n            &lt;h3>Hello, {this.state.name}!&lt;\/h3>;\r\n    }\r\n});\r\n \r\n\/\/ ES6\r\nclass App extends React.Component {\r\n    constructor() {\r\n        super();\r\n        this.state = { name: 'world' };\r\n    }\r\n    render() {\r\n        return\r\n            &lt;h3>Hello, {this.state.name}!&lt;\/h3>;\r\n    }\r\n}<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>ES5\u4e0eES6\u7279\u6027<\/p>\n","protected":false},"author":1,"featured_media":154,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":"","emotion":"","emotion_color":"","title_style":"","license":"","footnotes":""},"categories":[3],"tags":[18],"class_list":["post-152","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-frontend","tag-react"],"_links":{"self":[{"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/posts\/152","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/comments?post=152"}],"version-history":[{"count":2,"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/posts\/152\/revisions"}],"predecessor-version":[{"id":155,"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/posts\/152\/revisions\/155"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/media\/154"}],"wp:attachment":[{"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/media?parent=152"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/categories?post=152"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/reverieland.cn\/index.php\/wp-json\/wp\/v2\/tags?post=152"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}