在scala.js中实现jquery-ui

发布时间：2020-12-16 18:08:16 所属栏目：安全来源：网络整理

导读：我试图从 scala.js调用 jquery-ui.我已经尝试修改jquery库的实现方式但到目前为止没有成功.所以我定义了以下特征和包对象： trait JQueryUI extends js.Object { def apply(selector: String): JQueryUI = ??? val buttonset: js.Any = ???}package object j

我试图从 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.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!