You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
VDOM diffing follows the logic as outlined in its comment:
// Bail if you run into different types of nodes. Implies that the
// structure has changed significantly and it's not worth a diff.
This means it will bail if it runs into a thunk/node diff, even if the thunk would generate the same output as the node.
If follows that conditional use of lazy can trigger DOM node deletion/creation even for nodes that do not change, and this will cause a loss of user's input focus if a text input is recreated.
Below is an example where lazy is used to render input only when it contains an "s", and every time that condition changes the user's input focus will be lost.
SSCCE
moduleMainexposing (main)
importBrowserimportHtmlexposing (Html, input)
importHtml.Attributesexposing (value)
importHtml.Eventsexposing (onInput)
importHtml.Lazytype alias Model=StringinitialModel:ModelinitialModel ="Don't delete the \"s\""type Msg=InputChangedStringupdate:Msg->Model->Modelupdate msg model =case msg ofInputChanged s ->
s
view:Model->HtmlMsgview model =if String.contains "s" model thenHtml.Lazy.lazy viewInput model
else
viewInput model
viewInput:String->HtmlMsgviewInput s =
input [ value s, onInput InputChanged][]main:Program()ModelMsgmain =Browser.sandbox
{ init = initialModel
, view = view
, update = update
}
The text was updated successfully, but these errors were encountered:
VDOM diffing follows the logic as outlined in its comment:
This means it will bail if it runs into a thunk/node diff, even if the thunk would generate the same output as the node.
If follows that conditional use of
lazy
can trigger DOM node deletion/creation even for nodes that do not change, and this will cause a loss of user's input focus if a text input is recreated.Below is an example where
lazy
is used to render input only when it contains an "s", and every time that condition changes the user's input focus will be lost.SSCCE
The text was updated successfully, but these errors were encountered: