На этой простой веб-странице я пытаюсь создать Handsontable сетку:





  

Решение 1 - это чистая реализация JavaScript, которая работает отлично:

const config = {
    данные: [
        [1, 2, 3],
        [4, 5, 6],
        [7, 8, 9]
    ],
    rowHeaders: true,
    colHeaders: true,
    licenseKey: "non-commercial-and-evaluation"
}

window.addEventListener('load', ev => {
    const element = document.getElementById('grid-viewer');
    const grid = new Handsontable(element, config);

    console.log(element); // выводит 
...
console.log(config); // печатает объект { ... } });

Решение 2 - это реализация на Scala.js, которая является дословным переводом кода выше, с добавленным фасадом для сторонней библиотеки (Handsontable хранит свой конструктор в объекте окна):

пример пакета

импортировать org.scalajs.dom
import scala.scalajs.js
import scala.scalajs.js.annotation.JSGlobal

@js.native
@JSGlobal("Handsontable")
class Handsontable(element: dom.raw.Element, conf: js.Object) extends js.Object

объект Пример {
  def main(args: Array[String]): Блок = {
    object config extends js.Object {
      val data = List(
        List(1, 2, 3),
        List(4, 5, 6),
        List(7, 8, 9)
      )
      val rowHeaders = true
      val colHeaders = true
      val licenseKey = "non-commercial-and-evaluation"
    }

    dom.window.addEventListener("load", { ev: dom.Event =>
      val element = dom.document.getElementById("grid-viewer")
      val grid = new Handsontable(element, config)

      println(element) // печатает [объект HTMLDivElement]
      println(config) // печатает [объект Object]
    })
  }

}

Решение Scala.js вызывает конструктор, но затем терпит неудачу с TypeError: element is undefined. Вывод вызова println заставляет меня предположить, что element - это не сам элемент, а обертка.

Это моя конфигурация sbt:

enablePlugins(ScalaJSPlugin) // 1.3.1
enablePlugins(ScalaJSBundlerPlugin) // 0.20.0

scalaVersion := "2.13.4"

scalaJSUseMainModuleInitializer := true

libraryDependencies += "org.scala-js" %%% "scalajs-dom" %%% "1.1.0"

Почему моя программа на Scala.js ведет себя иначе, чем эквивалентная программа на JS? Правильно ли определен мой фасад?

Ответы (1)

Единственное, что кажется неправильным в вашем примере, это то, как вы передаете data в конфигурацию: List - это тип Scala, который является непрозрачным (т.е. бессмысленным) для кода JavaScript. Вместо него нужно использовать js.Array:

val data = js.Array(
  js.Array(1, 2, 3),
  js.Array(4, 5, 6),
  js.Array(7, 8, 9)
)

Является ли это источником проблемы или нет, сказать сложно, поскольку в сообщении об ошибке нет контекста.

2022 WebDevInsider