Skip to main content

Event Handling with `on-` Prefix

Event Handling with on- Prefix​

LumeoJS allows you to bind event handlers to HTML elements using the on- prefix.

Example​

Add a button with an on-click-a attribute in your HTML:

<button on-click="handleClick">Click Me</button>

Defining the Event Handler in JavaScript​

Define the handleClick function within your LumeoJS state:

<script>
  Lumeo((state) => {
    state.handleClick = () => {
      alert("Button clicked!");
    };
  });
</script>

Now, clicking the button triggers the handleClick function, which displays an alert message.