Page API¶

Overview¶

Pages allow you to build multi-page applications by decorating Python functions with me.page. To learn more, read the see multi-pages guide.

Examples¶

Simple, 1-page setup¶

To create a simple Mesop app, you can use me.page() like this:

import mesop as me

@me.page()
def foo():
    me.text("bar")

NOTE: If you do not provide a path argument, then it defaults to the root path "/".

Explicit 1-page setup¶

This is the same as the above example which explicitly sets the route to "/".

import mesop as me

@me.page(path="/")
def foo():
    me.text("bar")

API¶

`page` ¶

Defines a page in a Mesop application.

This function is used as a decorator to register a function as a page in a Mesop app.

PARAMETER	DESCRIPTION
`path`	The URL path for the page. Defaults to "/". TYPE: `str` DEFAULT: `'/'`
`title`	The title of the page. If None, a default title is generated. TYPE: `str \| None` DEFAULT: `None`
`stylesheets`	List of stylesheet URLs to load. TYPE: `list[str] \| None` DEFAULT: `None`
`security_policy`	The security policy for the page. If None, a default strict security policy is used. TYPE: `SecurityPolicy \| None` DEFAULT: `None`
`on_load`	An optional event handler to be called when the page is loaded. TYPE: `OnLoadHandler \| None` DEFAULT: `None`

RETURNS	DESCRIPTION
`Callable[[Callable[[], None]], Callable[[], None]]`	A decorator that registers the decorated function as a page.

`SecurityPolicy` `dataclass` ¶

A class to represent the security policy.

ATTRIBUTE	DESCRIPTION
`allowed_iframe_parents`	A list of allowed iframe parents. TYPE: `list[str]`
`allowed_connect_srcs`	A list of sites you can connect to, see MDN. TYPE: `list[str]`
`allowed_script_srcs`	A list of sites you can load scripts from, see MDN. TYPE: `list[str]`
`allowed_worker_srcs.`	//developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/worker-src). TYPE: `A list of sites you can load workers from, see [MDN](https`
`allowed_trusted_types`	A list of trusted type policy names, see MDN. TYPE: `list[str]`
`dangerously_disable_trusted_types`	A flag to disable trusted types. Highly recommended to not disable trusted types because it's an important web security feature! TYPE: `bool`

`LoadEvent` `dataclass` ¶

Represents a page load event.

ATTRIBUTE	DESCRIPTION
`path`	The path loaded TYPE: `str`

`on_load`¶

You may want to do some sort of data-processing when a page is first loaded in a session.

Simple handler¶

An on_load handler is similar to a regular event handler where you can mutate state.

import time

import mesop as me


def fake_api():
  yield 1
  time.sleep(1)
  yield 2
  time.sleep(2)
  yield 3


def on_load(e: me.LoadEvent):
  for val in fake_api():
    me.state(State).default_values.append(val)
    yield


@me.page(path="/docs/on_load", on_load=on_load)
def app():
  me.text("onload")
  me.text(str(me.state(State).default_values))


@me.stateclass
class State:
  default_values: list[int]

Generator handler¶

The on_load handler can also be a generator function. This is useful if you need to call a slow or streaming API and want to return intermediate results before all the data has been received.

import time

import mesop as me


def on_load(e: me.LoadEvent):
  state = me.state(State)
  state.default_values.append("a")
  yield
  time.sleep(1)
  state.default_values.append("b")
  yield


@me.page(path="/docs/on_load_generator", on_load=on_load)
def app():
  me.text("onload")
  me.text(str(me.state(State).default_values))


@me.stateclass
class State:
  default_values: list[str]