![]() ![]() This creates an Laminar element and sets two attributes on it. Here's how to specify desired attributes: input(typ := "checkbox", defaultChecked := true) The div() call described above creates an empty div element – no children, no attributes, nothing. Read on for how to use this element we've created. In contrast, in a virtual DOM library (which Laminar is not) you typically create new instances of virtual elements when they change, and these get loosely matched to a dom.Element which could actually be a different element over time depending on how the updates that you're requesting and the implementation of virtual DOM's diffing algorithm. That reference is immutable, so these two instances will go together for the duration of their lifetimes. When you create a Laminar element, Laminar immediately creates the underlying dom.Element as well. If you don't care about the type of your HTML element, you can use the more general HtmlElement type (alias for ReactiveHtmlElement) in your method signatures.ĭiv() is not a virtual DOM element. This particular Div type has no special features, it simply indicates that the tag name is div. This is useful mostly for event handlers and third party integrations. If you need to, you can access the underlying JS DOM element via the. The apply method created a Laminar Div element that is linked to the real JS DOM element that it represents. HtmlTag extends Tag from Scala DOM Types and contains basic information needed to create such an element, such as its tag name ("div").ĭiv() is a ReactiveHtmlElement (aliased as Div). For example, this is how we know that onClick events produce dom.MouseEvent events and not dom.KeyboardEvent.ĭiv is an HtmlTag. Laminar uses Scala DOM Types to generate listings of typed HTML & SVG tags, attributes, props, event props, etc. prefix will help you distinguish native JS platform types from Laminar types. I highly recommend that you import this dom object and not dom.* or dom._ because the dom. This object contains scala-js-dom native JS DOM types. It's much more pleasant to write and read Mod than Modifier].Īnother import you will want in some cases is import – whenever you see dom.X in documentation, this import is assumed. There are special import considerations for working with SVG elements.ĭo check out the available aliases in the L object. (or api._ in Scala 2), and access Laminar and Airstream values and types with L and A prefixes respectively, e.g. As it is a very thin interface to native JS types, you can generally use a higher version of scala-js-dom than what Laminar uses without any issue. If there's a missing prop, consider contributing it there. The html/svg tags, attributes, props, styles, and event names in Laminar come from Scala DOM Types. If you ever have a reason to use a slightly newer version of Airstream without upgrading Laminar, add this to your build.sbt as well: "com.raquo" %%% "airstream" % ""Īs you can see, Laminar and Airstream versions can diverge slightly, so don't use a single LaminarVersion variable to for both. ![]() Every Laminar version includes the latest version of Airstream that was available at the time it was published. DependenciesĪdd Laminar to libraryDependencies of your Scala.js project in build.sbt: "com.raquo" %%% "laminar" % "15.0.0" // Requires Scala.js 1.13.0 If you want to follow along with an IDE, download one of the starter kit projects from the Resources page, or learn how to render your app in the Rendering section below. If you're new here, watching the Laminar video will be time well spent – it's a good introduction to Laminar, covering both the big ideas and some inner workings. ![]() Documentation sections progress from basic to advanced, so each next section usually assumes that you've read all previous sections. That said, the documentation provided here explains the mechanics of Laminar in great detail. Don't be afraid to use "Go to definition" functionality of your IDE to see how a certain method works. Laminarįor documentation of older versions, see git tags. ![]() This documentation is for Laminar version v15.0.0. ![]()
0 Comments
Leave a Reply. |