Event Handling
Lynx provides an event mechanism similar to the Web, allowing developers to design and implement custom interaction logic based on events.
However, unlike the Web system, Lynx's event response mechanism supports dual-threaded processing. This means that event handling functions can be executed in the main thread or background thread as needed, thereby optimizing performance and response speed.
What is an event
An event is a signal that triggers an action in the system. When an event is triggered, developers can implement the corresponding logic by listening to the event and executing the corresponding code. For example, developers can listen to click events and modify the background color of a node when a user clicks on the page.
Example 1:
Listen for user clicks
When a user clicks on a page, the system triggers a tap event.
As shown in the figure, developers can choose to handle the event in the main thread or the background thread.
-
When timely event response is not required, you can choose to handle the event in the background thread, and the event processing of the background thread will not block the main thread.
-
When timely event response is required, you can choose to handle the event in the main thread, which can avoid event delays caused by cross-threading, but it should be noted that excessive event processing may cause the main thread to be busy.
Specifically, if developers want to listen to the click event of a certain node, they can set the event handler property of type bind on the node:
If the event handling function runs on the main thread, you need to add an additional main-thread: prefix before the event handler property, for example:
How to intercept or specifically listen to an event?
In Lynx , the event handler property can also implement event interception and cross-component event listening. For details, please refer to Event Propagation.
Handling user clicks
When an event is triggered on a node, the event handling function set by the event handler property will be called. This function will receive an event object as a parameter, which contains detailed information about the event.
What are the event objects?
All event objects inherit from Event. Developers can write event processing logic based on event objects in event processing functions.
When the event processing function is a main thread script, you need to add a 'main thread' directive to the first line of the function body to indicate that the function runs on the main thread.
Main thread event processing
In Lynx, the event objects of the main thread and the background thread are different. The event object of the background thread is a pure json object, while the event object of the main thread is an operable Event Object.
How to operate nodes based on event objects?
Lynx provides a variety of ways to operate nodes, please refer to Manipulating elements for details.
For example, for Example 1, when the developer chooses to handle events in the main thread, he can directly get e.currentTarget in the main thread script and call setStyleProperty to modify the background color of the node.
Example 2
Background thread event processing
For the event processing function of the background thread, developers cannot directly operate the node through e.currentTarget, but can obtain the node reference through SelectorQuery and then call setNativeProps Modify the background color of the node.
Example 3:
Summary
So far, you have learned how to listen to user clicks and perform corresponding operations based on the event object.
For developers, Lynx events provide a Web-like API, but with a unique dual-threaded event response mechanism, allowing developers to choose to perform event processing in the main thread or background thread as needed, thereby optimizing performance and response speed.