scalajs Diode无法在状态更改时重新呈现React组件?

时间:2016-07-06 19:44:44

标签: scala reactjs scala.js diode

编辑:我是一个使用过时版二极管的人。升级到1.0版本解决了这个问题。

我设置了Scalajs / Diode / React系统,在一个部分中,我遇到了一些让我难过的行为(缺乏)行为。我的印象是当你通过如下所示的行将React组件连接到二极管状态时:

val ChangeClassButton = SelectCircuit.connect(_.selection)(p => DiodeChangeClassButton(p))

只要在二极管电路中更新selection,ChangeClassButton就应该重新渲染。

我已经验证了二极管事件调度和状态更新似乎按预期工作,但connect更改后,selection中的React组件selection不会重新呈现。附加到电路状态的其他部分的其他组件在相关的状态变化时按预期重新渲染。

以下是应该重新呈现的React组件:

val DiodeChangeClassButton = ReactComponentB[ModelProxy[String]]("SaveButton")
    .render_P { case proxy =>
      println("Rendering ChangeClassButton and selection is: " + proxy.value)
      if(proxy.value != "")
        <.div(
          ^.cursor := "pointer",
          ^.onClick --> proxy.dispatch(ChangeClass(proxy.value)),
          "String is: " + proxy.value
        )
      else
        <.div()
  }.build
  val ChangeClassButton = SelectCircuit.connect(_.selection)(p => DiodeChangeClassButton(p))

以下是调度更改selection

的二极管操作的组件
val DiodeClassificationBox = ReactComponentB[ModelProxy[Pot[PaperInfoShort]]]("ClassBox")
    .render_P { case proxy =>
      println("ClassificationBox is rendering")
      <.div(
        TitleBar("Classification"),
        ReadOnlyInputBar(proxy.value.get.mrPrim),
        <.div(
          ^.onMouseUp --> proxy.dispatch(HighlightChange),
          ReadOnlyInputBar((for(s <- proxy.value.get.secondaries) yield s.classCode).mkString(" "))
        )
      )
  }.build
  val ClassificationBox = SelectCircuit.connect(_.paperInfo)(p => DiodeClassificationBox(p))

这是SelectCircuit中的动作处理程序:

class HighlightHandler[M](modelRW: ModelRW[M, String]) extends ActionHandler(modelRW)
{
    override def handle =
      {
        case InitSelection =>
          updated("")
        case HighlightChange =>
          if (checkClasses(dom.window.getSelection().toString))
            updated(dom.window.getSelection().toString)
          else
            updated("")
      }
}

在我这里调用updated()时,连接到_.selection的预期React组件是否错误重新渲染?我对二极管和反应都很新,所以在可能的情况下我可能会误解。

感谢您的帮助。

0 个答案:

没有答案