react选项卡
<script src="js/react.development.js"></script>
<script src="js/react-dom.development.js"></script>
<script src="js/babel.min.js"></script>
<body>
<div id="root"></div>
<script>
class Tab extends React.Component{
render(){
return (
<div>
...
</div>
);
}
}
ReactDOM.render(<Tab/>,document.getElementById('root'));
</script>
</body>
完善一下呗
<script src="js/react.development.js"></script>
<script src="js/react-dom.development.js"></script>
<script src="js/babel.min.js"></script>
<body>
<div id="root"></div>
<script>
class Tab extends React.Component{
render(){
return (
<div>
...
</div>
);
}}
ReactDOM.render(<Tab/>,document.getElementById('root'));
</script>
</body>
//这里是div代码
<div className="tab_con">
<div className="tab_btns">
<input type="button" value="按钮一" className="active" />
<input type="button" value="按钮二" />
<input type="button" value="按钮三" />
</div>
<div className="tab_cons">
<div className="current">内容一</div>
<div>内容二</div>
<div>内容三</div>
</div>
</div>
再完善一下呗
<script src="js/react.development.js"></script>
<script src="js/react-dom.development.js"></script>
<script src="js/babel.min.js"></script>
<body>
<div id="root"></div>
<script>
class Tab extends React.Component{
constructor(props){
super(props);
this.state={num:0};
}
render(){
return (
<div>
...
</div>
);
}}
ReactDOM.render(<Tab/>,document.getElementById('root'));
</script>
</body>