Closed daig closed 7 years ago
Hi @daig , I haven't used keyed elements in Elm, but this seems like something worth implementing.
I like the idea of translating a node with a key={k}
attribute into (k,node)
, but I'll have to look into promoting the parent node into Html.Keyed.node.
Can you send me a working example in plain Elm?
The example I'm working with is:
import List
import Uuid exposing (Uuid)
import Html exposing (li)
import Note
import Html.Keyed as Keyed
type alias Notes = List (Uuid,Note.Model)
view : Notes -> Html Msg
view notes = Keyed.ul [] (notes |> List.map (\(id,note) -> (toString id, li [] [Note.view note])))
Here's your example in elmx
:
import Html
import Html.Attributes
import Html.Keyed
import List
import Uuid exposing (Uuid)
import Note
type alias Notes = List (Uuid,Note.Model)
view : Notes -> Html Msg
view notes =
let
items = notes |> List.map (\(id,note) -> <li key={toString id}>{Note.view note}</li>)
in
<ul keyed>{:items}</ul>
In JSX there's special syntax for keyed nodes in a list:
There is functionality for keyed nodes in Elm but so far as I can tell they use a different datastructure from normal nodes. So, it will be tricky to implement this transform as it A possible first step is, rather than nesting like above (#9), simply translate
<li key={k}>{stuff}</li>
to(k,li [] [stuff])
and require the keyed parent node explicitly.