Change Events
In LiveView Native, elements can support client-side changes to their value outside of a <form>
.
Synchronizing the values must be handled manually by the LiveView using change events.
Client-side changes
Use the phx-change
attribute to respond to client-side changes to an element's value.
<TextField text={@text} phx-change="value-changed" />
A handle_event/3
implementation with the name "value-changed"
will be called anytime the user changes the text of the TextField
.
def handle_event("value-changed", new_value, socket) do
{:noreply, assign(socket, text: new_value)}
end
The phx-debounce
, phx-throttle
, and phx-target
attributes can be used to configure the event.
Refer to the documentation for an element to find out if it supports client-side changes.
Server-side changes
Each element has an attribute that controls its value.
For example, TextField
in the SwiftUI client uses the attribute text
.
See the documentation for an element to find out what attribute it uses.
Whenever the attribute's value is changed, the client will update to display the new value. No change event is sent when the server updates the value.
Modifier change events
Some modifiers have values that can be changed by the client.
To receive change events on these modifiers, pass a LiveViewNativePlatform.Modifier.Types.Event
to the change
argument.
sheet(is_presented: @show, change: "presentation-changed")
Provide a map to change
for more advanced configuration.
sheet(is_presented: @show, change: %{ event: "presentation-changed", debounce: 2000, target: @myself })
A change event will be sent with every argument of the modifier that can be change-tracked.
def handle_event("presentation-changed", %{ "is_presented" => show }, socket) do
{:noreply, assign(socket, show: show)}
end
In the example above, the server can show/hide the sheet by setting the show
assign.
When the user swipes down on the sheet to close it, the "presentation-changed"
event will be called with the value false
.
See the documentation for a modifier to find out which arguments can be change-tracked.