呈现带有二极管错误的React(scalajs React)组件
我将使用二极管来管理单向数据流的应用程序状态。我使用Playframework 2.4和Scala.js,下面是客户端子项目的呈现带有二极管错误的React(scalajs React)组件,scala,playframework,scala.js,scalajs-react,diode,Scala,Playframework,Scala.js,Scalajs React,Diode,我将使用二极管来管理单向数据流的应用程序状态。我使用Playframework 2.4和Scala.js,下面是客户端子项目的build.sbt的一部分: libraryDependencies ++= Seq( ... "me.chrons" %%% "diode" % "1.0.0", "me.chrons" %%% "diode-react" % "1.0.0", "com.github.japgolly.scalajs-react" %%% "core
build.sbt
的一部分:
libraryDependencies ++= Seq(
...
"me.chrons" %%% "diode" % "1.0.0",
"me.chrons" %%% "diode-react" % "1.0.0",
"com.github.japgolly.scalajs-react" %%% "core" % "0.11.3",
"com.github.japgolly.scalajs-react" %%% "extra" % "0.11.3"
),
我能够运行scalajs react的基本样本,并决定扩展二极管支持。我写了一个Curcuit
对象:
object TimerCircuit extends Circuit[TimerRootModel] with ReactConnector[TimerRootModel] {
// initialModel and actionHanler implemented here
}
教程和示例没有向我们展示如何使用ReactDOM.render(…)
来渲染React组件,而只是使用包japgolly.scalajs.React.extra.router
但是,这次我不想使用路由器,只想将我的组件呈现为HTML根标记,如下所示:
class ReactStateSampleView() {
case class State(secondsElapsed: Long)
class Backend($: BackendScope[ModelProxy[String], State]) {
val DefaultInterval: Long = 1000
//noinspection ScalaStyle
var interval: js.UndefOr[js.timers.SetIntervalHandle] = js.undefined
def tick: Callback = $.modState(s => State(s.secondsElapsed + 1))
def start: Callback = Callback {
interval = js.timers.setInterval(DefaultInterval)(tick.runNow())
}
def clear: Callback = Callback {
interval foreach js.timers.clearInterval
interval = js.undefined
}
def render(s: State): ReactTag =
<.div("Seconds elapsed: ", s.secondsElapsed)
}
val timer = ReactComponentB[ModelProxy[String]]("Timer")
.initialState(State(0))
.renderBackend[Backend]
.componentDidMount(_.backend.start)
.componentWillMount(_.backend.clear)
.build
val sc = TimerCircuit.connect(_.data)
ReactDOM.render(sc(p => timer(p)), dom.document.getElementById("timer"))
不起作用。Project未编译并显示“RuntimeException:存在链接错误”
如何解决这个问题
更新
以下是链接错误和堆栈跟踪的确切消息:
[info] Fast optimizing C:\tmp\project\client\target\scala-2.11\client-fastopt.js
[error] Referring to non-existent class japgolly.scalajs.react.Callback$ResultGuard$
[error] called from diode.react.ReactConnector$$anonfun$wrap$1.apply(java.lang.Object)scala.Function0
[error] called from diode.react.ReactConnector$$anonfun$wrap$1.apply(java.lang.Object)java.lang.Object
[error] called from japgolly.scalajs.react.Internal$FnComposer$$anonfun$apply$2$$anonfun$apply$3.apply(java.lang.Object)java.lang.Object
[error] called from japgolly.scalajs.react.CompState$RootAccessor.modState(japgolly.scalajs.react.CompScope$CanSetState,scala.Function1,scala.Function0)scala.Unit
[error] called from japgolly.scalajs.react.CompState$RootAccessor.modState(java.lang.Object,scala.Function1,scala.Function0)scala.Unit
[error] called from japgolly.scalajs.react.CompState$WriteCallbackOps$class.modState(japgolly.scalajs.react.CompState$WriteCallbackOps,scala.Function1,scala.Function0)scala.Function0
[error] called from japgolly.scalajs.react.CompState$ReadCallbackWriteCallback.modState(scala.Function1,scala.Function0)scala.Function0
[error] called from org.example.client.playground.ReactStateSampleView$Backend.tick()scala.Function0
[error] called from org.example.client.playground.ReactStateSampleView$Backend$$anonfun$start$1.apply$mcV$sp()scala.Unit
...
Caused by: java.lang.RuntimeException: There were linking errors
at scala.sys.package$.error(package.scala:27) ~[scala-library-2.11.8.jar:na]
at org.scalajs.core.tools.linker.frontend.BaseLinker.linkInternal(BaseLinker.scala:133) ~[na:na]
at org.scalajs.core.tools.linker.frontend.BaseLinker.linkInternal(BaseLinker.scala:86) ~[na:na]
at org.scalajs.core.tools.linker.frontend.LinkerFrontend$$anonfun$4.apply(LinkerFrontend.scala:54) ~[na:na]
at org.scalajs.core.tools.linker.frontend.LinkerFrontend$$anonfun$4.apply(LinkerFrontend.scala:54) ~[na:na]
at org.scalajs.core.tools.logging.Logger$class.time(Logger.scala:28) ~[na:na]
at org.scalajs.sbtplugin.Loggers$SbtLoggerWrapper.time(Loggers.scala:7) ~[na:na]
at org.scalajs.core.tools.linker.frontend.LinkerFrontend.link(LinkerFrontend.scala:53) ~[na:na]
at org.scalajs.core.tools.linker.Linker$$anonfun$link$1.apply$mcV$sp(Linker.scala:50) ~[na:na]
at org.scalajs.core.tools.linker.Linker$$anonfun$link$1.apply(Linker.scala:49) ~[na:na]
链接错误表明scalajs和二极管之间存在二进制不兼容。从您的
库依赖项来看,这似乎是合理的,因为:
- 您依赖于
scalajsreact-core
0.11.3,但是
- 您还依赖于
二极管1.0.0
如果scalajs react core从0.11.1到0.11.3发生了二进制不兼容的更改,这就可以解释您的问题
如果我是对的,您可以通过升级到二极管1.1.0来解决此问题。链接错误的确切消息是什么,以及上面显示了哪些堆栈跟踪?这些信息对于确定代码/依赖项的哪一部分负责至关重要。@sjrd,我已经更新了这个问题。堆栈跟踪指向org.scalajs
only我指的是“存在链接错误”消息上方的堆栈跟踪。这才是有趣的。它告诉我们什么是无法链接的。@sjrd,我添加了更多行。完整的堆栈跟踪非常长。我满怀希望地展示了最重要的台词。
[info] Fast optimizing C:\tmp\project\client\target\scala-2.11\client-fastopt.js
[error] Referring to non-existent class japgolly.scalajs.react.Callback$ResultGuard$
[error] called from diode.react.ReactConnector$$anonfun$wrap$1.apply(java.lang.Object)scala.Function0
[error] called from diode.react.ReactConnector$$anonfun$wrap$1.apply(java.lang.Object)java.lang.Object
[error] called from japgolly.scalajs.react.Internal$FnComposer$$anonfun$apply$2$$anonfun$apply$3.apply(java.lang.Object)java.lang.Object
[error] called from japgolly.scalajs.react.CompState$RootAccessor.modState(japgolly.scalajs.react.CompScope$CanSetState,scala.Function1,scala.Function0)scala.Unit
[error] called from japgolly.scalajs.react.CompState$RootAccessor.modState(java.lang.Object,scala.Function1,scala.Function0)scala.Unit
[error] called from japgolly.scalajs.react.CompState$WriteCallbackOps$class.modState(japgolly.scalajs.react.CompState$WriteCallbackOps,scala.Function1,scala.Function0)scala.Function0
[error] called from japgolly.scalajs.react.CompState$ReadCallbackWriteCallback.modState(scala.Function1,scala.Function0)scala.Function0
[error] called from org.example.client.playground.ReactStateSampleView$Backend.tick()scala.Function0
[error] called from org.example.client.playground.ReactStateSampleView$Backend$$anonfun$start$1.apply$mcV$sp()scala.Unit
...
Caused by: java.lang.RuntimeException: There were linking errors
at scala.sys.package$.error(package.scala:27) ~[scala-library-2.11.8.jar:na]
at org.scalajs.core.tools.linker.frontend.BaseLinker.linkInternal(BaseLinker.scala:133) ~[na:na]
at org.scalajs.core.tools.linker.frontend.BaseLinker.linkInternal(BaseLinker.scala:86) ~[na:na]
at org.scalajs.core.tools.linker.frontend.LinkerFrontend$$anonfun$4.apply(LinkerFrontend.scala:54) ~[na:na]
at org.scalajs.core.tools.linker.frontend.LinkerFrontend$$anonfun$4.apply(LinkerFrontend.scala:54) ~[na:na]
at org.scalajs.core.tools.logging.Logger$class.time(Logger.scala:28) ~[na:na]
at org.scalajs.sbtplugin.Loggers$SbtLoggerWrapper.time(Loggers.scala:7) ~[na:na]
at org.scalajs.core.tools.linker.frontend.LinkerFrontend.link(LinkerFrontend.scala:53) ~[na:na]
at org.scalajs.core.tools.linker.Linker$$anonfun$link$1.apply$mcV$sp(Linker.scala:50) ~[na:na]
at org.scalajs.core.tools.linker.Linker$$anonfun$link$1.apply(Linker.scala:49) ~[na:na]