在scala.js中实现jquery-ui

前端之家收集整理的这篇文章主要介绍了在scala.js中实现jquery-ui前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图从 scala.js调用 jquery-ui.我已经尝试修改jquery库的实现方式但到目前为止没有成功.所以我定义了以下特征和包对象:

trait JQueryUI extends js.Object {

    def apply(selector: String): JQueryUI = ???
    val buttonset: js.Any = ???
}

package object jqueryui extends js.GlobalScope {
    val jQueryUI: JQueryUI = ???
}

然后添加了一个JSApp如下:

object JQueryUIApp extends JSApp {
    def main(): Unit = {
        jqueryui.jQueryUI("#sports").buttonset
    }   
}

但在我的JavaScript控制台上,我收到以下错误

TypeError: ScalaJS.g[“jQueryUI”] is not a function (0,
ScalaJS.g[“jQueryUI”])(“#sports”)[“buttonset”]

有人能告诉我我错过了什么吗?

解决方法

通过在包对象中声明类似的val jQueryUI,您告诉Scala.js这对应于名为jQueryUI的JavaScript中的全局变量.现在情况并非如此:您正在寻找的实际变量名为jQuery.您可以通过使用@JSName明确命名该值来解决此问题:

import scala.scalajs.js.annotation.JSName

package object jqueryui extends js.GlobalScope {
  @JSName("jQuery")
  val jQueryUI: JQueryUI = ???
}

但是,由于jQuery-UI实际上是jQuery对象的扩展,我将使用scalajs-jquery的JQuery特性上的扩展方法来定义它.这将允许使用普通的jQuery用于两种用法(jQuery-core方法和jQuery-UI方法).一般机制在the Calling JavaScript guide中以“猴子修补”的标题解释.在你的情况下,它看起来像这样:

trait JQueryUI extends JQuery {
  val buttonset: js.Any = ???
}

object JQueryUI {
  implicit def jQueryUIExtensions(query: JQuery): JQueryUI =
    query.asInstanceOf[JQueryUI]
}

使用这些定义,您可以:

import org.scalajs.jquery._
import JQueryUI.jQueryUIExtensions

def main(): Unit = {
  jQuery("#sports").buttonset
}

请注意,我正在使用普通的jquery.jQuery对象,该对象返回一个普通的JQuery对象,但后来我调用了在JQueryUI中定义的buttonset值.这是因为隐式转换jQueryUIExtensions.

猜你在找的Scala相关文章