pub struct Scope<'a, P = ()> {
    pub scope: &'a ScopeState,
    pub props: &'a P,
}
Expand description

Components in Dioxus use the “Context” object to interact with their lifecycle.

This lets components access props, schedule updates, integrate hooks, and expose shared state.

For the most part, the only method you should be using regularly is render.

Example

#[derive(Props)]
struct ExampleProps {
    name: String
}

fn Example(cx: Scope<ExampleProps>) -> Element {
    cx.render(rsx!{ div {"Hello, {cx.props.name}"} })
}

Fields

scope: &'a ScopeState

The internal ScopeState for this component

props: &'a P

The props for this component

Methods from Deref<Target = &'a ScopeState>

Get the height of this Scope - IE the number of scopes above it.

A Scope with a height of 0 is the root scope - there are no other scopes above it.

Example
let mut dom = VirtualDom::new(|cx|  cx.render(rsx!{ div {} }));
dom.rebuild();

let base = dom.base_scope();

assert_eq!(base.height(), 0);

Get the Parent of this Scope within this Dioxus VirtualDOM.

This ID is not unique across Dioxus VirtualDOMs or across time. IDs will be reused when components are unmounted.

The base component will not have a parent, and will return None.

Example
let mut dom = VirtualDom::new(|cx|  cx.render(rsx!{ div {} }));
dom.rebuild();

let base = dom.base_scope();

assert_eq!(base.parent(), None);

Get the ID of this Scope within this Dioxus VirtualDOM.

This ID is not unique across Dioxus VirtualDOMs or across time. IDs will be reused when components are unmounted.

Example
let mut dom = VirtualDom::new(|cx|  cx.render(rsx!{ div {} }));
dom.rebuild();
let base = dom.base_scope();

assert_eq!(base.scope_id(), 0);

Get a handle to the raw update scheduler channel

Create a subscription that schedules a future render for the reference component

Notice: you should prefer using prepare_update and get_scope_id

Schedule an update for any component given its ScopeId.

A component’s ScopeId can be obtained from use_hook or the ScopeState::scope_id method.

This method should be used when you want to schedule an update for a component

Get the ScopeId of a mounted component.

ScopeId is not unique for the lifetime of the VirtualDom - a ScopeId will be reused if a component is unmounted.

Get the ScopeId of a mounted component.

ScopeId is not unique for the lifetime of the VirtualDom - a ScopeId will be reused if a component is unmounted.

Get the Root Node of this scope

This method enables the ability to expose state to children further down the VirtualDOM Tree.

This is a “fundamental” operation and should only be called during initialization of a hook.

For a hook that provides the same functionality, use use_provide_context and use_consume_context instead.

When the component is dropped, so is the context. Be aware of this behavior when consuming the context via Rc/Weak.

Example
struct SharedState(&'static str);

static App: Component = |cx| {
    cx.use_hook(|_| cx.provide_context(SharedState("world")));
    rsx!(cx, Child {})
}

static Child: Component = |cx| {
    let state = cx.consume_state::<SharedState>();
    rsx!(cx, div { "hello {state.0}" })
}

Provide a context for the root component from anywhere in your app.

Example
struct SharedState(&'static str);

static App: Component = |cx| {
    cx.use_hook(|_| cx.provide_root_context(SharedState("world")));
    rsx!(cx, Child {})
}

static Child: Component = |cx| {
    let state = cx.consume_state::<SharedState>();
    rsx!(cx, div { "hello {state.0}" })
}

Try to retrieve a SharedState with type T from the any parent Scope.

Pushes the future onto the poll queue to be polled after the component renders.

Spawns the future but does not return the TaskId

Spawn a future that Dioxus will never clean up

This is good for tasks that need to be run after the component has been dropped.

Informs the scheduler that this task is no longer needed and should be removed on next poll.

Take a lazy VNode structure and actually build it with the context of the VDom’s efficient VNode allocator.

This function consumes the context and absorb the lifetime, so these VNodes must be returned.

Example
fn Component(cx: Scope<Props>) -> Element {
    // Lazy assemble the VNode tree
    let lazy_nodes = rsx!("hello world");

    // Actually build the tree and allocate it
    cx.render(lazy_tree)
}

Store a value between renders

This is the foundational hook for all other hooks.

  • Initializer: closure used to create the initial hook state
  • Runner: closure used to output a value every time the hook is used

To “cleanup” the hook, implement Drop on the stored hook value. Whenever the component is dropped, the hook will be dropped as well.

Example
// use_ref is the simplest way of storing a value between renders
fn use_ref<T: 'static>(initial_value: impl FnOnce() -> T) -> &RefCell<T> {
    use_hook(|| Rc::new(RefCell::new(initial_value())))
}

Trait Implementations

Returns a copy of the value. Read more

Performs copy-assignment from source. Read more

The resulting type after dereferencing.

Dereferences the value.

Auto Trait Implementations

Blanket Implementations

Gets the TypeId of self. Read more

Immutably borrows from an owned value. Read more

Mutably borrows from an owned value. Read more

Returns the argument unchanged.

Calls U::from(self).

That is, this conversion is whatever the implementation of From<T> for U chooses to do.

The resulting type after obtaining ownership.

Creates owned data from borrowed data, usually by cloning. Read more

🔬 This is a nightly-only experimental API. (toowned_clone_into)

Uses borrowed data to replace owned data, usually by cloning. Read more

The type returned in the event of a conversion error.

Performs the conversion.

The type returned in the event of a conversion error.

Performs the conversion.