Files
Géry Debongnie eb2b32ab60 [IMP] owl: add basic support for sub roots
In this commit, we extend the owl App class to support multiple sub
roots. This is useful for situations where we want to mount sub
components in non-managed DOM. This is exactly what the Knowledge app is
doing, with mounting views in an html editor.

Currently, this requires some difficult and fragile hacks, and still,
the result is that it is very easy to mix components from the main App
and a SubApp.  But Knowledge does not actually care about creating a sub
app. It only needs the possibility to mount sub components in dynamic
places.

closes #1640
2024-09-27 15:35:37 -04:00
..

🦉 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)
  • validate: validates if an object satisfies a specified schema
  • whenReady: utility function to execute code when DOM is ready
  • batched: utility function to batch function calls