{"id":40,"date":"2026-05-21T11:32:21","date_gmt":"2026-05-21T03:32:21","guid":{"rendered":"https:\/\/mitongxue.cn\/?p=40"},"modified":"2026-05-21T12:10:35","modified_gmt":"2026-05-21T04:10:35","slug":"react-19%e5%b7%b2%e5%ae%8c%e5%85%a8%e7%a7%bb%e9%99%a4%e4%ba%86-proptypes-%e7%9a%84%e5%86%85%e7%bd%ae%e6%94%af%e6%8c%81","status":"publish","type":"post","link":"https:\/\/mitongxue.cn\/index.php\/2026\/05\/21\/react-19%e5%b7%b2%e5%ae%8c%e5%85%a8%e7%a7%bb%e9%99%a4%e4%ba%86-proptypes-%e7%9a%84%e5%86%85%e7%bd%ae%e6%94%af%e6%8c%81\/","title":{"rendered":"React 19\u5df2\u5b8c\u5168\u79fb\u9664\u4e86 PropTypes \u7684\u5185\u7f6e\u652f\u6301"},"content":{"rendered":"\n<h2 class=\"wp-block-heading has-large-font-size\"><strong>React19\u4ee5\u524d<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>.\/components\/ChildCom<\/strong><\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>import PropTypes from 'prop-types';\nconst ChildCom = (props) => {\n    return (\n        &lt;div>\n            \u8fd9\u662f\u5b50\u7ec4\u4ef6\n            &lt;span>\u59d3\u540d\uff1a{props.name} \u5e74\u9f84\uff1a{props.age}&lt;\/span>\n        &lt;\/div>\n    );\n};\n\nChildCom.propTypes = {\n    name: PropTypes.string.isRequired,\n    age : PropTypes.number.isRequired,\n}\n\nexport default ChildCom;<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>App.jsx<\/strong><\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>import '.\/App.css'\nimport ChildCom from '.\/components\/ChildCom';\n\nfunction App() {\n  \n  return (\n    &lt;>\n      &lt;div>Hello React&lt;\/div>\n      &lt;ChildCom name=\"\u5f20\u4e09\" age=\"18\" \/>\n    &lt;\/>\n  )\n}\nexport default App<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u5982\u4f55\u770b\u5230\u8b66\u544a<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u6253\u5f00\u6d4f\u89c8\u5668\u7684\u5f00\u53d1\u8005\u5de5\u5177\uff08F12\uff09\uff0c\u67e5\u770b Console \u6807\u7b7e\u9875\uff0c\u4f60\u5e94\u8be5\u80fd\u770b\u5230\u7c7b\u4f3c\u8fd9\u6837\u7684\u8b66\u544a\uff1a<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Warning:&amp;nbsp;Failed&amp;nbsp;prop&amp;nbsp;type:&amp;nbsp;The&amp;nbsp;prop&amp;nbsp;\n`age`&amp;nbsp;is&amp;nbsp;marked&amp;nbsp;as&amp;nbsp;required&amp;nbsp;in&amp;nbsp;\n`ChildCom`,&amp;nbsp;but&amp;nbsp;its&amp;nbsp;value&amp;nbsp;is&amp;nbsp;\n`undefined`.<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">React19\u4e4b\u540e<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u4e0d\u4f1a\u4ea7\u751f\u9519\u8bef\u4fe1\u606f\uff0c\u56e0\u4e3aReact 19 \u5df2\u7ecf \u5b8c\u5168\u79fb\u9664\u4e86 PropTypes \u7684\u5185\u7f6e\u652f\u6301\uff0c\u53ef\u4ee5\u91c7\u7528Typescript\u5b9e\u73b0\u6821\u9a8c<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">ChildCom.tsx<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>interface Props {\n    name: string;\n    age: number;\n}\nconst ChildCom = (props: Props) => {\n    return (\n        &lt;div>\n            \u8fd9\u662f\u5b50\u7ec4\u4ef6\n            &lt;span>\u59d3\u540d\uff1a{props.name} \u5e74\u9f84\uff1a{props.age}&lt;\/span>\n        &lt;\/div>\n    );\n};<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>React19\u4ee5\u524d .\/components\/Ch..<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,11],"tags":[],"class_list":["post-40","post","type-post","status-publish","format-standard","hentry","category-react-","category-front"],"featured_image_urls":{"full":"","thumbnail":"","medium":"","medium_large":"","large":"","1536x1536":"","2048x2048":""},"author_info":{"info":["\u9648 \u67d0\u4eba"]},"category_info":"<a href=\"https:\/\/mitongxue.cn\/index.php\/category\/front\/react-%e5%89%8d%e7%ab%af\/\" rel=\"category tag\">React<\/a> <a href=\"https:\/\/mitongxue.cn\/index.php\/category\/front\/\" rel=\"category tag\">\u524d\u7aef<\/a>","tag_info":"\u524d\u7aef","comment_count":"0","_links":{"self":[{"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/posts\/40","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/comments?post=40"}],"version-history":[{"count":4,"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/posts\/40\/revisions"}],"predecessor-version":[{"id":44,"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/posts\/40\/revisions\/44"}],"wp:attachment":[{"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/media?parent=40"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/categories?post=40"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mitongxue.cn\/index.php\/wp-json\/wp\/v2\/tags?post=40"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}