在 scalajs-react 中设置 ajax 成功状态

Question

我正在尝试在 scalajs-react 中成功提交另一个弹出窗口时打开一个弹出窗口。我的问题是成功状态没有被修改。这是我的 addNewAgent 方法，在提交第一个弹出窗口时作为回调调用。

def addNewAgent(userModel: UserModel, addNewAgent: Boolean = false): Callback = {
  println(addNewAgent)
  if(addNewAgent){
    createUser(userModel).onComplete {
      case Success(s) =>
        println(s.msgType)
        if (s.msgType == ApiResponseMsg.CreateUserWaiting){
          t.modState(s => s.copy(showNewAgentForm = false, showConfirmAccountCreation = true))
        } else {
          t.modState(s => s.copy(showNewAgentForm = false, showRegistrationFailed = true))
        }
      case Failure(s) =>
        println(s)
        t.modState(s => s.copy(showRegistrationFailed = true))
      // now you need to refresh the UI
    }
    t.modState(s => s.copy(showNewAgentForm = false))
  } else {
    t.modState(s => s.copy(showNewAgentForm = false))
  }
}

组件代码为：

val component = ReactComponentB[Props]("AddNewAgent")
.initialState(State()) // initial state from TodoStore
.backend(new Backend(_))
.renderPS(($, P, S) => {
  val B = $.backend
  <.div()(
    Button(Button.Props(B.addNewAgentForm(), CommonStyle.default, Seq(HeaderCSS.Style.SignUpBtn)),"Sign Up"),
     if (S.showNewAgentForm) NewAgentForm(NewAgentForm.Props(B.addNewAgent))        
    else   if (S.showConfirmAccountCreation  ) ConfirmAccountCreation(ConfirmAccountCreation.Props(B.confirmAccountCreation))

      else
      Seq.empty[ReactElement]
  )
})
//  .componentDidMount(scope => scope.backend.mounted(scope.props))
.configure(OnUnmount.install)
.build
def apply(props: Props) = component(props)

Answer 1

对于任何正在寻找此问题答案的人来说，这里发生的事情是未来完成中的 modState 调用将永远不会被真正调用因为他们 return 没有运行的回调。要解决此问题，您需要添加 runNow() 之类的 t.modState(s => s.copy(showNewAgentForm = false, showRegistrationFailed = true)).runNow()

在 scalajs-react 中设置 ajax 成功状态

Setting state in ajax success in scalajs-react

scala.js

scalajs-react