您好，能上传一下代码么？

老师能上传一下代码么

慕粉4362853

2017-02-22

源自：React入门 1-1

关注问题我要回答

868

操作

收起

1 回答

时光有染
2017-02-22

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <title>React_event</title>
   <script src="https://cdn.bootcss.com/react/15.4.2/react.min.js"></script>
   <script src="https://cdn.bootcss.com/react/15.4.2/react-dom.min.js"></script>
   <script src="https://cdn.bootcss.com/babel-standalone/6.22.1/babel.min.js"></script>
</head>
<body>
<div id="container"></div>
   <script type="text/babel">
       var TestClick=React.createClass({
           handleClick: function(){
               var tipE=ReactDOM.findDOMNode(this.refs.tip);//新版本用ReactDOM
               if (tipE.style.display==="none") {
                   tipE.style.display="inline";
               }else{
                   tipE.style.display="none";
               }
           },
           render: function(){
               return (
                   <div>
                       <button onClick={this.handleClick}>显示|隐藏</button><span ref="tip">测试文字</span>
                   </div>
                   );
           }
       });
       var TestInput=React.createClass({
           getInitialState: function(){
               return {
                   inputContent: ""
               }
           },
           changeHandler: function(event){
               this.setState({
                   inputContent: event.target.value
               });
           },
           render: function(){
               return (
                   <div>
                       <input type="text" onChange={this.changeHandler}/>
                       <span>{this.state.inputContent}</span>
                   </div>
                   );
           }
       });
       ReactDOM.render(
           <div>
               <TestClick />
               <br/><br/>
               <TestInput />
           </div>,
           document.getElementById("container")
           );
   </script>
</body>
</html>