scalajs-react:如何循环对象序列以填充 UI
scalajs-react: How to loop a Seq of objects to populate UI
我正在探索 scalajs-react。我有一个用例,当用户点击一个按钮时,我从后端获取数据。数据是对象列表。我需要以某种形式显示每个对象。所以基本上这将是我假设的一系列 divs。
那么我如何迭代自定义对象的 Seq 并在 scalajs-react 中用它们的内容填充 UI?
所以我尝试将代码放在现有 div 中:
<.div(
this.employees.map( employee =>
<.form(
<.label("Name of the employee:",
<.input(^.`type` := "text", ^.cls := "form-control",
^.value := employee.name, ^.onChange ==> updateName)),
<.br,
<.label("Addresses:",
<.input(^.`type` := "textarea", ^.rows := 100, ^.cols := 20,^.cls := "form-control",
^.value := employee.addresses.mkString(","), ^.onChange ==> updateAddresses))
)
)
)
但这给出了错误:Required Tagmod, found Seq[Tag[html.form]]
看来您需要在 map
之后添加 .toTagMod
。请参阅 the documentation on VDOM
中的 Collections 部分
我正在探索 scalajs-react。我有一个用例,当用户点击一个按钮时,我从后端获取数据。数据是对象列表。我需要以某种形式显示每个对象。所以基本上这将是我假设的一系列 divs。
那么我如何迭代自定义对象的 Seq 并在 scalajs-react 中用它们的内容填充 UI?
所以我尝试将代码放在现有 div 中:
<.div(
this.employees.map( employee =>
<.form(
<.label("Name of the employee:",
<.input(^.`type` := "text", ^.cls := "form-control",
^.value := employee.name, ^.onChange ==> updateName)),
<.br,
<.label("Addresses:",
<.input(^.`type` := "textarea", ^.rows := 100, ^.cols := 20,^.cls := "form-control",
^.value := employee.addresses.mkString(","), ^.onChange ==> updateAddresses))
)
)
)
但这给出了错误:Required Tagmod, found Seq[Tag[html.form]]
看来您需要在 map
之后添加 .toTagMod
。请参阅 the documentation on VDOM