怎么更改react中的input框的值

Question

<div id="container">

</div>

<script type="text/jsx">

 var Test=React.createClass({

   handleClick:function(){

      

   },

  render:function(){

    return (

    <div>

        <button onClick={this.handleClick}>

         click me to see count:{this.state.count}

         </button>

         <input  defaultValue="ttt"/>

         </div>

    );

  },

 });

 ReactDOM.render(

    <Test />,

    document.getElementById("container")

 )

</script>

在不适用ref属性的前提下，怎么通过onClick方法更改input的值。

Answer 1

将输入框的值同步到state中就可以了<div id="container"></div><script type="text/jsx">&nbsp;var Test=React.createClass({&nbsp;getInitialState:function() {&nbsp; &nbsp; &nbsp; &nbsp; return {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; count:''&nbsp; &nbsp; &nbsp; &nbsp; };&nbsp; &nbsp; },&nbsp; &nbsp;handleClick:function(){&nbsp; &nbsp; &nbsp; console.log(this.state.count)&nbsp; &nbsp;},&nbsp; render:function(){&nbsp; &nbsp; return (&nbsp; &nbsp; <div>&nbsp; &nbsp; &nbsp; &nbsp; <button onClick={this.handleClick}>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;click me to see count:{this.state.count}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<input&nbsp; defaultValue="ttt" value={this.state.count}/>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div>&nbsp; &nbsp; );&nbsp; },&nbsp;});&nbsp;ReactDOM.render(&nbsp; &nbsp; <Test />,&nbsp; &nbsp; document.getElementById("container")&nbsp;)</script>