1. <!DOCTYPE html>
    2. <html>
    3. <head>
    4. <script src="../build/react.js"></script>
    5. <script src="../build/react-dom.js"></script>
    6. <script src="../build/browser.min.js"></script>
    7. </head>
    8. <body>
    9. <div id="example"></div>
    10. <script type="text/babel">
    11. var data = 123;
    12. var MyTitle = React.createClass({
    13. getDefaultProps : function(){
    14. return {
    15. title:'hello world'
    16. };
    17. },
    18. propTypes: {
    19. title: React.PropTypes.string.isRequired,
    20. },
    21. render: function() {
    22. return <h1> {this.props.title} </h1>;
    23. }
    24. });
    25. ReactDOM.render(
    26. <MyTitle title={data} />,
    27. document.getElementById('example')
    28. );
    29. </script>
    30. </body>
    31. </html>
    32. 01、组件类的PropTypes 属性,用来验证组件实例的属性是否符合要求
    33. 001、上面的MyTitle 组件有一个title 属性。PropTypes 告诉React ,这个
    34. title 属性是必须的,而且它的值必须是字符串。
    35. 02、组件类的getDefaultProps 方法 可以用来设置组件属性的默认值。