Question

您如何使用Reason从DOM中选择项目。我正在使用bs-webapi进行DOM绑定，这就是我想要做的事情：

let parent = document |> Document.querySelector(".parent");
let child = Element.querySelector(".child", parent);

然而，BuckleScript抱怨因为父级不是正确的类型。它表示父类型为option(Dom.element)，父级应为Dom.element.t。我是理性的新手并且正在努力学习。我不明白option(Dom.element)的含义或如何使上述代码块工作。非常感谢任何帮助

Answer 1

您需要打开选项变量，我们可以使用开关执行此操作并使用内置的None / Some变体。

您可以在此处找到有关选项变体的一些文档：https://reasonml.github.io/docs/en/newcomer-examples.html#using-the-option-type

以下是有关选项的更多文档：https://reasonml.github.io/docs/en/variant.html#option

为此，您可以将代码更改为以下内容：

let parent = document |> Document.querySelector(".parent");
let child = switch (parent) {
  | Some(p) => switch (Element.querySelector(".child", p)) {
    | Some(c) => c
    | None => raise(Failure("Unable to find child selector"))
  }
  | None => raise(Failure("Unable to find parent selector"))
};

如果你想改为登录控制台而不是失败，你需要返回一个有效的Dom.element.t，可能是这样的：

let emptyEl = document |> Document.createElement("noscript");
let parent = document |> Document.querySelector(".parent");
let child = switch (parent) {
  | Some(p) => switch (Element.querySelector(".child", p)) {
    | Some(c) => c
    | None => {
      Js.log("Unable to find child selector");
      emptyEl;
    }
  }
  | None => {
    Js.log("Unable to find parent selector");
    emptyEl;
  }
};

然后，您需要检查您的子元素是否为noscript，以查看您是否找到了您要查找的孩子。

从DOM中选择元素 - Reasonml / BuckleScript querySelector

1 个答案: