diff --git a/docs/src/content/docs/features/events/system.mdx b/docs/src/content/docs/features/events/system.mdx index 259add09c..678abff2f 100644 --- a/docs/src/content/docs/features/events/system.mdx +++ b/docs/src/content/docs/features/events/system.mdx @@ -25,10 +25,10 @@ app.Event.Emit("user-logged-in", map[string]interface{}{ **JavaScript (listen):** ```javascript -import { OnEvent } from '@wailsio/runtime' +import { Events } from '@wailsio/runtime' -OnEvent("user-logged-in", (data) => { - console.log(`User ${data.name} logged in`) +Events.On("user-logged-in", (event) => { + console.log(`User ${event.data.name} logged in`) }) ``` @@ -49,9 +49,9 @@ app.Event.Emit("notification", message) ```javascript // Listen in JavaScript -OnEvent("order-created", handleOrder) -OnEvent("payment-processed", handlePayment) -OnEvent("notification", showNotification) +Events.On("order-created", handleOrder) +Events.On("payment-processed", handlePayment) +Events.On("notification", showNotification) ``` ### System Events @@ -174,17 +174,17 @@ app.Event.On("order-created", updateInventory) **Basic listener:** ```javascript -import { OnEvent } from '@wailsio/runtime' +import { Events } from '@wailsio/runtime' -OnEvent("event-name", (data) => { - console.log("Event received:", data) +Events.On("event-name", (event) => { + console.log("Event received:", event.data) }) ``` **With cleanup:** ```javascript -const unsubscribe = OnEvent("event-name", handleEvent) +const unsubscribe = Events.On("event-name", handleEvent) // Later, stop listening unsubscribe() @@ -193,9 +193,15 @@ unsubscribe() **Multiple handlers:** ```javascript -OnEvent("data-updated", updateUI) -OnEvent("data-updated", saveToCache) -OnEvent("data-updated", logChange) +Events.On("data-updated", updateUI) +Events.On("data-updated", saveToCache) +Events.On("data-updated", logChange) +``` + +**One Time handlers:** + +```javascript +Events.Once("data-updated", updateVariable) ``` ## System Events @@ -385,9 +391,12 @@ app.Event.On("get-user-data", func(e *application.CustomEvent) { // Send response app.Event.Emit("user-data-response", user) }) +``` +```javascript // Frontend receives response -OnEvent("user-data-response", (user) => { +Events.On("user-data-response", (event) => { + const user = event.data displayUser(user) }) ``` @@ -401,7 +410,8 @@ OnEvent("user-data-response", (user) => { app.Event.Emit("global-notification", "System update available") // Each window handles it -OnEvent("global-notification", (message) => { +Events.On("global-notification", (event) => { + const message = event.data showNotification(message) }) ``` @@ -496,25 +506,27 @@ func main() { **JavaScript:** ```javascript -import { OnEvent, Emit } from '@wailsio/runtime' +import { Events, Emit } from '@wailsio/runtime' // Listen for notifications -OnEvent("notification", (data) => { - showNotification(data.message) +Events.On("notification", (event) => { + showNotification(event.data.message) }) // Listen for theme changes -OnEvent("theme-changed", (isDark) => { +Events.On("theme-changed", (event) => { + const isDark = event.data document.body.classList.toggle('dark', isDark) }) // Listen for window focus -OnEvent("window-focused", (windowName) => { +Events.On("window-focused", (event) => { + const windowName = event.data console.log(`Window ${windowName} focused`) }) // Handle close confirmation -OnEvent("confirm-close", () => { +Events.On("confirm-close", (event) => { if (confirm("Close window?")) { Emit("close-confirmed", true) } diff --git a/v3/UNRELEASED_CHANGELOG.md b/v3/UNRELEASED_CHANGELOG.md index 78a0421d6..77bc7c3ec 100644 --- a/v3/UNRELEASED_CHANGELOG.md +++ b/v3/UNRELEASED_CHANGELOG.md @@ -17,6 +17,11 @@ After processing, the content will be moved to the main changelog and this file ## Added +- Added how to do `One Time Handlers` in the docs for `Listening to Events in JavaScript` by @AbdelhadiSeddar + +## Changed + +- Changed the use of `Event` into `Events` according to changes in `@wailsio/runtime` and appropriate function calls in the docs in `Features/Events/Event System` by @AbdelhadiSeddar ## Changed