Как установить атрибут DOM (т.е. стиль) с помощью Reason/Bucklescript?

Итак, прежде всего, это уже доступно в bs-webapi. Но если вы хотите воссоздать (и упростить) его, вот как:

external document : Dom.document = "document" [@@bs.val];
external querySelector : string => option Dom.element = "" [@@bs.send.pipe: Dom.document] [@@bs.return null_to_opt];
external style : Dom.element => Dom.cssStyleDeclaration = "" [@@bs.get];
external setColor : Dom.cssStyleDeclaration => string => unit = "color" [@@bs.set];

let () =
    switch (document |> querySelector ".element") {
      | Some element => setColor (style element) "red";
      | None => ()
    };

Вы также можете отказаться от безопасности типов и сделать это так:

external document : Js.t {..} = "document" [@@bs.val];

let () = {
  let element = document##querySelector ".element";
  element##style##color #= "red"
};

Но тогда я предполагаю, что вы делаете это, чтобы учиться, и в этом случае последнее было бы ужасной идеей.

Один из способов сделать это:

[@@@bs.config {no_export: no_export}];

external document : Dom.document = "document" [@@bs.val];

external query_selector : Dom.document => string => Dom.element = "querySelector" [@@bs.send];

external set_attribute : Dom.element => string => string => unit = "setAttribute" [@@bs.send];

let element = query_selector document ".element";

set_attribute element "style" "color: red";

Однако я не уверен, что есть лучший способ.

Примечания:

[@@@bs.config {no_export: no_export}]; запрещает Bucklescript экспортировать модули ES6.

модуль Dom предоставляет множество типов.

Вопросы без ответов:

• Как я могу использовать тип attr модуля Dom вместо строки?
• Как я могу использовать тип cssStyleDeclaration модуля Dom вместо использования строки?