组件的混合

4.2

<script type=text/babel>//    定义一个网站导航    //定义的大组件    class Webtabs extends React.Component{        render(){            return (                <div>                    <h1>{this.props.info}</h1>                    <Href data-href={this.props['data-href']}/>                </div>//注意使用多个标签的时候需要一个父盒子包裹            )        }    }    //定义一个子组件    class Href extends React.Component{        render(){            return <a href={this.props['data-href']}>查看</a>        }    }    ReactDOM.render(        <div>            <Webtabs info="爱前端" data-href="http://www.aiqianduan.cn"/>            <Webtabs info="百度" data-href="http://www.baidu.com"/>            <Webtabs info="淘宝" data-href="http://www.taobao.com"/>            //使用自定义标签的时候最好加上data-,以防将本身的属性混淆        </div>        ,document.querySelector(".box"))</script>

4.3类名的获取

如果要获取标签的类名，使用this.props.className(避讳js的一些关键字);