Tree Context API

This API is a Map that uses class constructor as key and its instance as value.

This means you create your contexts by creating classes.

class MyContext { constructor(readonly value: string) {} }

The child must define the context it requires

function Child(this: Proton.Component) {
  const context = this.context.require(MyContext)

  return <span>{context.value}</span>
}

The parent provides the context at will

function Parent(this: Proton.Component) {
  this.context.provide(new MyContext("Cool"))

  return <div><Child /></div>
}

If children require contexts but no parent is providing one, they will error.

function Child(this: Proton.Component) {
  const context = this.context.require(MyContext) // Error: No context provided.

  return <span>{context.value}</span>
}

info

Learn what happens when component faces error at Fault Tolerance

info

Learn how to react to component errors at Error catching