owl/doc

🦉 Owl overview 🦉

Here is a list of everything exported by the Owl library:

Main entities:

• App: represent an Owl application (mainly a root component,a set of templates, and a config)
• Component: the main class to define a concrete Owl component
• mount: main entry point for most application: mount a component to a target
• xml: helper to define an inline template

Reactivity

• useState: create a reactive object (hook, linked to a specific component)
• reactive: create a reactive object (not linked to any component)
• markRaw: mark an object or array so that it is ignored by the reactivity system
• toRaw: given a reactive objet, return the raw (non reactive) underlying object

Lifecycle hooks:

• onWillStart: hook to define asynchronous code that should be executed before component is rendered
• onMounted: hook to define code that should be executed when component is mounted
• onWillPatch: hook to define code that should be executed before component is patched
• onWillUpdateProps: hook to define code that should be executed before component is updated
• onPatched: hook to define code that should be executed when component is patched
• onWillRender: hook to define code that should be executed before component is rendered
• onRendered: hook to define code that should be executed after component is rendered
• onWillUnmount: hook to define code that should be executed before component is unmounted
• onWillDestroy: hook to define code that should be executed before component is destroyed
• onError: hook to define a Owl error handler

Other hooks:

• useComponent: return a reference to the current component (useful to create derived hooks)
• useEffect: define an effect with its dependencies
• useEnv: return a reference to the current env
• useExternalListener: add a listener outside of a component DOM
• useRef: get an object representing a reference (t-ref)
• useChildSubEnv: extend the current env with additional information (for child components)
• useSubEnv: extend the current env with additional information (for current component and child components)

Utility/helpers:

• EventBus: a simple event bus
• loadFile: an helper to load a file from the server
• markup: utility function to define strings that represent html (should not be escaped)
• status: utility function to get the status of a component (new, mounted or destroyed)
• whenReady: utility function to execute code when DOM is ready