带有 scrollIntoViewOptions 的 scalajs scrollIntoView

Question

HTML scrollIntoView 有两个选项：scrollIntoView(alignToTop) 和 scrollIntoView(scrollIntoViewOptions)，其中 scrollIntoViewOptions 是一个带有 behavior 的对象（"auto" 或 "smooth"）、block（"start"、"center"、"end" 或 "nearest"）和 inline（"start"、"center" , "end", 或 "nearest").

然而，ScalaJs 只导入了第一个选项。这有什么理由吗？

我想在 scalajs 中使用这个 javacript 代码：

element.scrollIntoView({behavior: "smooth", block: "center"})

我试过这个 scalajs 代码，但它不起作用。它根本不滚动。有什么想法吗？

@js.native
trait ElementExtended extends Element {
    def scrollIntoView(o: scala.Dynamic): Unit = js.native
}
element.asInstanceOf[ElementExtended].scrollIntoView(js.Dynamic.literal(behavior = "smooth", block = "center"))

Answer 1

我自己运行解决了这个问题并通过以下方式解决了它：

@js.native
trait ElementExtras extends js.Object {
  def scrollIntoView(options: ScrollIntoViewOptions): Unit
}

trait ScrollIntoViewOptions extends js.Object {
  var behavior: js.UndefOr[String] = js.undefined
  var block: js.UndefOr[String] = js.undefined
  var inline: js.UndefOr[String] = js.undefined
}

然后我添加了一个隐式转换来转换它：

implicit def element2Extras(element: html.Element): ElementExtras = element.asInstanceOf[ElementExtras]

然后，要使用我只需执行以下操作：

element.scrollIntoView(new ScrollIntoViewOptions {
  behavior = "smooth"
  block = "end"
})

带有 scrollIntoViewOptions 的 scalajs scrollIntoView

scalajs scrollIntoView with scrollIntoViewOptions

scala.js