美文网首页
2019-01-09

2019-01-09

作者: 一叶一华年 | 来源:发表于2019-01-09 15:56 被阅读1次

    react中的验证PropTypes为何没有报错???

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>React-Template</title>
        <script type="text/javascript" src="../js/react.min.js" ></script>
        <script type="text/javascript" src="../js/react-dom.min.js" ></script>
        <!-- <script type="text/javascript" src="js/babel.min.js" ></script> -->
        <script src="https://cdn.bootcss.com/babel-standalone/6.22.1/babel.min.js"></script>
        <script src="https://cdn.bootcss.com/prop-types/15.6.1/prop-types.js"></script>
    </head>
    <body>
      <div id="example"></div>
      <script type="text/babel">
            class Son extends React.Component{
                render(){
                    return(
                        <div>
                            {this.props.number}
                            <br/>
                            {this.props.array}
                            <br/>
                            {this.props.boolean.toString()}
                        </div>
                    )
                }
            }
            Son.propTypes={
                number:PropTypes.number,
                array:PropTypes.array,
                boolean:PropTypes.bool,
            }
            class Father extends React.Component{
                render(){
                    return(
                        <Son number={"1"} array={'[1,2,3,4]'} boolean={'false'}/>
                    )
                }
            }
            ReactDOM.render(
                <Father/>,
                document.getElementById("example")
            )
        </script>
    </body>
    </html>
    

    相关文章

      网友评论

          本文标题:2019-01-09

          本文链接:https://www.haomeiwen.com/subject/lorgrqtx.html