React属性一state—修改state中的值

任务：界面上有一行文字“甄姬”，当鼠标点击甄姬时，文字变为“安琪拉”；再点击再互换。

<script type="text/babel">
    class MyComponent extends React.Component{
      state = {
        flag:true,
      }
      handleClick= ()=>{  //使用箭头函数，改变this指向，函数内部的this指向组件MyComponent
        const {flag} = this.state;
        // 每次使用setState()都会重新渲染render
        this.setState({ 
          flag:!flag,
        })
      }
      render(){
        const {flag} = this.state;
        var msg = flag ? "甄姬" : "安琪拉";
        return(
          <h1 onClick={this.handleClick}>{msg}</h1>
        )
      }
    }
    ReactDOM.render(<MyComponent />,document.getElementById("root"));
  </script>