Binding.scala使用教程3--双向绑定

Jerry0Chou

于 2019-01-26 18:07:23 发布

阅读量299

点赞数 1

CC 4.0 BY-SA版权

文章标签： binding.scala 双向绑定

本文链接：https://blog.csdn.net/qq_23989985/article/details/86659614

本文介绍了如何使用ThoughtWorks Binding库进行Scala Web开发，通过示例展示了如何在DOM环境中使用Binding库来创建响应式UI元素，如输入框，并实现其值的实时更新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

效果图

在这里插入图片描述

目录结构

环境搭建查看 Binding.scala使用教程1–环境搭建

在这里插入图片描述

View

import com.thoughtworks.binding.Binding.{ Var }
import com.thoughtworks.binding.dom
import org.scalajs.dom.raw.Event
import org.scalajs.dom.html.Input

object View
{
  @dom
   def render = {
    val input = Var("")
    <div>
      <input oninput={ event: Event => input.value= event.currentTarget.asInstanceOf[Input].value }/>
      Your input value is { input.bind }
    </div>
  }
}

MainApp

import scala.scalajs.js.JSApp
import com.thoughtworks.binding.dom
import org.scalajs.dom.document

object MainApp extends JSApp
{
  def main(): Unit =
  {
    println("I am the MainApp")
    dom.render(document.body, View.render)
  }
}