Module functional 

Function components are a simplified version of normal components. They consist of a single function annotated with the attribute #[component] that receives props and determines what should be rendered by returning Html.

Functions with the attribute have to return Html and may take a single parameter for the type of props the component should accept. The parameter type needs to be a reference to a Properties type (ex. props: &MyProps). If the function doesn’t have any parameters the resulting component doesn’t accept any props.

Just mark the component with the attribute. The component will be named after the function.

#[component]
fn HelloWorld() -> Html {
    html! { "Hello world" }
}

More details about function components and Hooks can be found on Yew Docs

Macros

use_prepared_state

Use a state prepared on the server side and its value is sent to the client side during hydration.

use_transitive_state

Use a state created as an artifact of the server-side rendering.

Structs

HookContext

A hook context to be passed to hooks.

UseForceUpdateHandle

A handle which can be used to force a re-render of the associated function component.

UseReducerDispatcher

Dispatcher handle for use_reducer and use_reducer_eq hook

UseReducerHandle

State handle for use_reducer and use_reducer_eq hook

UseStateHandle

State handle for the use_state hook.

UseStateSetter

Setter handle for use_state and use_state_eq hook

Traits

FunctionProvider

Trait that allows a struct to act as Function Component.

Hook

A trait that is implemented on hooks.

Reducible

A trait that implements a reducer function of a type.

TearDown

Trait describing the destructor of use_effect hook.

Functions

use_callback

Get a immutable reference to a memoized Callback. Its state persists across renders. It will be recreated only if any of the dependencies changes value.

use_context

Hook for consuming context values in function components. The context of the type passed as T is returned. If there is no such context in scope, None is returned. A component which calls use_context will re-render when the data of the context changes.

use_effect

use_effect is used for hooking into the component’s lifecycle and creating side effects.

use_effect_with

This hook is similar to use_effect but it accepts dependencies.

use_force_update

This hook is used to manually force a function component to re-render.

use_memo

Get a immutable reference to a memoized value.

use_mut_ref

This hook is used for obtaining a mutable reference to a stateful value. Its state persists across renders.

use_node_ref

This hook is used for obtaining a NodeRef. It persists across renders.

use_reducer

This hook is an alternative to use_state. It is used to handle component’s state and is used when complex actions needs to be performed on said state.

use_reducer_eq

use_reducer but only re-renders when prev_state != next_state.

use_ref

This hook is used for obtaining a reference to a stateful value. Its state persists across renders.

use_state

This hook is used to manage state in a function component.

use_state_eq

use_state but only re-renders when prev_state != next_state.

Attribute Macros

component

This attribute creates a function component from a normal Rust function.

function_component

A re-export of component with the older name.

hook

This attribute creates a user-defined hook from a normal Rust function.