Element API

How to use the Element API to manually control a component and call methods on it.

Description

Every Wompo Component will be rendered in the DOM as a Web Component, so it'll be accessible by your scripts. In this guide we will explore what methods you can call and which properties you can access.

Methods

Every element exposes the followig methods:

  • <b>requestRender()</b> - If called, it will start the rendering process of the component.
  • <b>onDisconnected()</b> - Should not be called directly: it's a callback function that you can override, and will be executed whenever the component is disconnected from the DOM.
  • <b>updateProp(propName, newValue)</b> - It will update a prop of the component and automatically ask to re-render it if the new value differs from the previous one. The first parameter is the name of the prop you want to update, and the second is the new value you want to set on it.

If you used the useExposed hook inside of your component, the component will also have the methods you exposed.

Properties

Every element exposes the followig properties:

  • <b>props</b> - The object containing all the props of the component.
  • <b>hooks</b> - The list of hooks that the component has. You can access this property but we strongly recommend to not modify any of them. It is exposed only so that you can add your own hooks. See the useHook hook to know more.

If you used the useExposed hook inside of your component, the component will also have the properties you exposed.