react 和 vue不太一样
vue直接通过修改data里面的值就可以改变视图view
但是react是通过 this.setState 这个方法来改变状态(也就是值)
//类定义一个组件,绑定一个点击事件改变值 class Click extends React.Component { constructor(props){ super(props) this.state ={ //设置的默认值 name:'浪里白漂' } this.handleClick=this.handleClick.bind(this) } handleClick(){ this.setState({ //点击事件调用 setState 方法,设置一个新的值 name:'高速浪子' }) } render(){ return ( <div> <button onClick={this.handleClick}> 点击 </button> <span>{this.state.name}</span> </div> ) } } ReactDOM.render( <Click/>,document.getElementById('example') )
结果如下: