Reactjs 在同一页上呈现新组件

我有一个表单组件，在填写此表单时（单击提交按钮），我希望在同一页面上呈现一个新组件来代替表单，并添加一些注释，例如“祝贺您填写表单”

我不确定实现这一目标的正确方法是什么。我不确定在这里进行条件渲染是否正确

另外，这应该在呈现表单组件的页面上完成，还是在动作创建者中完成

---

谢谢你的帮助

这是一个如何操作的示例代码：

export var LoginBox = React.createClass({

  getInitialState(){
    return{
      registered:false
    }
  },
  Register(){
    //submit registration form and change form to login form
    ...
    this.setState({registered : true});
  },
  login(){
    // submit login form here
  },
  loginForm(){
      var{registered} = this.state;
      if(registered){// your registeration form
          return(
            <form onSubmit={this.Register}>
              <div><input ref="number" type="tel"/></div>
              <button type="submit">register</button>
            </form>
          );
        }else{
          return (// your login form
            <form onSubmit={this.login}>
              <div><input type="number" ref="activationCode"/></div>
              <button type="submit">login</button>
            </form>
          );
        }
      }
  },
  render(){
    return (
      <div className="loginBox">
          {loginForm()}
      </div>
    )
  }
});

export var LoginBox=React.createClass({
getInitialState（）{
返回{
注册：假
}
},
寄存器（）{
//提交登记表并将表格更改为登录表格
...
this.setState（{registered:true}）；
},
登录（）{
//在此提交登录表单
},
loginForm（）{
var{registered}=this.state；
如果（已注册）{//您的注册表格
返回(
登记
);
}否则{
返回（//您的登录表单
登录
);
}
}
},
render（）{
返回(
{loginForm（）}
)
}
});

这是一个示例代码。首先，您需要初始化默认表单的状态。然后，在表单提交上更改状态，以便在视图上更改表单

---

我希望它能帮助您理解它。

使用条件渲染是可以的，因为状态是为这个用例设计的。是的，它可以很好地使用条件渲染。谢谢