Как показать функцию исправления JS библиотеки Incremental DOM в приложении GWT, используя @JsInterop

Я хотел бы использовать библиотеку Incremental DOM в своем приложении GWT.

https://google.github.io/incremental-dom/

Поскольку я пришел из мира Java, я борюсь с концепциями пространств имен и модулей JavaScript. Я смог использовать Closure Compiler с закрывающей версией Incremental DOM (должен быть собран из исходников).

Он начинается со следующей строки:

goog.module('incrementaldom');

Поэтому, если бы я использовал его в обычном JS, я бы набрал:

var patch = goog.require('incrementaldom').patch;

А потом patch Функция будет доступна в объеме моего кода. Но как сделать его доступным из @JsInterop аннотированные классы?

Я попробовал что-то вроде:

public class IncrementalDom {

  @JsMethod(namespace = "incrementaldom", name = "patch")
  public static native void patch(Element element, Patcher patcher);

  @JsFunction
  @FunctionalInterface
  public interface Patcher {
    void apply();
  }

}

Но это не работает. Я получаю эту ошибку во время выполнения:

(TypeError) : Cannot read property 'patch' of undefined

Так что, думаю, мне нужно как-то разоблачить incrementaldom модуль или, по крайней мере, только patch метод. Но я не знаю как.

1 ответ

Решение

После целого дня борьбы я нашел решение. В модуле goog.module: модуль ES6, похожий на альтернативу документу goog.provide, я обнаружил недостающую информацию о роли goog.scope функция - требуемые модули видны только в пределах вызова.

Я создал еще один JS-файл Closure incrementaldom.js:

goog.provide('app.incrementaldom'); // assures creation of namespace
goog.require("incrementaldom");

goog.scope(function() {
  var module = goog.module.get("incrementaldom");
  var ns = app.incrementaldom;
  app.incrementaldom.patch = module.patch;
});

goog.exportSymbol("app.incrementaldom", app.incrementaldom);

И теперь я могу назвать это из кода Java следующим образом:

public class IncrementalDom {

  @JsMethod(namespace = "app.incrementaldom", name = "patch")
  public static native void patch(Element element, Patcher patcher);

  @JsFunction
  @FunctionalInterface
  public interface Patcher {
    void apply();
  }

}

Тем не менее, я должен определить каждый объект, экспортируемый в исходном модуле, отдельно в файле Closure JS. К счастью, мне нужно только patch метод. Я надеюсь, что однажды я найду менее громоздкий способ @JsInterop с goog.module:(

Другие вопросы по тегам