Crate yew_state

Location agnostic shared state for yew components.

Usage

Give your component GlobalHandle properties and wrap it with SharedStateComponent. This may be done for any T that implements Clone + Default.

struct Model {
    handle: GlobalHandle<T>,
}

impl Component for Model {
    type Properties = GlobalHandle<T>;
    ...
}

type MyComponent = SharedStateComponent<Model>;

Access current state with state.

let state: &T = self.handle.state();

Modify shared state from anywhere using reduce

// GlobalHandle<MyAppState>
self.handle.reduce(|state| state.user = new_user);

or from a callback with reduce_callback.

// GlobalHandle<usize>
let onclick = self.handle.reduce_callback(|state| *state += 1);
html! {
    <button onclick = onclick>{"+1"}</button>
}

reduce_callback_with provides the fired event.

let oninput = self
    .handle
    .reduce_callback_with(|state, i: InputData| state.user.name = i.value);

html! {
    <input type="text" placeholder = "Enter your name" oninput = oninput />
}

Properties with Shared State

Get shared state in custom props with SharedState.

#[derive(Clone, Properties)]
pub struct Props {
    #[prop_or_default]
    pub handle: GlobalHandle<AppState>,
}

impl SharedState for Props {
    type Handle = GlobalHandle<AppState>;

    fn handle(&mut self) -> &mut Self::Handle {
        &mut self.handle
    }
}

State Persistence

Persistent storage requires that T also implement Serialize, Deserialize, and Storable.

use serde::{Serialize, Deserialize};
use yew_state::Storable;
use yew::services::storage::Area;

#[derive(Serialize, Deserialize)]
struct T;

impl Storable for T {
    fn key() -> &'static str {
        "myapp.storage.t"
    }

    fn area() -> Area {
        // or Area::Session
        Area::Local
    }
}

Then use StorageHandle instead of GlobalHandle.

Structs

SharedStateComponent

Wrapper for a component with shared state.

Enums

Area	An area to keep the data in.

Traits

Handle	Provides mutable access for wrapper component to update
SharedState	Allows any Properties to have shared state.
Storable	Allows state to be stored persistently in local or session storage.

Type Definitions

GlobalHandle	Handle for basic shared state.
StorageHandle	Handle for shared state with persistent storage.