مجموعة التبديل · الأحداث
الاشتراك في تغييرات القيمة من LiveView أو العميل.
عند تغيير القيمة (الخادم)
| Time | Source | Value |
|---|---|---|
|
No event yet. Interact with the components to receive new events |
||
<.toggle_group
class="toggle-group"
on_value_change="toggle_group_changed"
multiple
>
<:item value="lorem">Lorem</:item>
<:item value="duis">Duis</:item>
<:item value="donec">Donec</:item>
</.toggle_group>
def handle_event("toggle_group_changed", %{"id" => id, "value" => value} = params, socket) do
IO.inspect(params, label: "toggle_group_changed")
{:noreply, socket}
end
عند تغيير القيمة (العميل)
| Time | Source | Value |
|---|---|---|
|
No event yet. Interact with the components to receive new events |
||
<.toggle_group
id="toggle-group-events-client"
class="toggle-group"
on_value_change_client="toggle-group-changed"
multiple
>
<:item value="lorem">Lorem</:item>
<:item value="duis">Duis</:item>
<:item value="donec">Donec</:item>
</.toggle_group>
const el = document.getElementById("toggle-group-events-client");
el?.addEventListener("toggle-group-changed", (event) => console.log(event.detail));
const el = document.getElementById("toggle-group-events-client");
el?.addEventListener("toggle-group-changed", (event: Event) =>
console.log((event as CustomEvent<unknown>).detail)
);