Expand description
The reactive system for the Leptos Web framework.
§Fine-Grained Reactivity
Leptos is built on a fine-grained reactive system, which means that individual reactive values (“signals,” sometimes known as observables) trigger the code that reacts to them (“effects,” sometimes known as observers) to re-run. These two halves of the reactive system are inter-dependent. Without effects, signals can change within the reactive system but never be observed in a way that interacts with the outside world. Without signals, effects run once but never again, as there’s no observable value to subscribe to.
Here are the most commonly-used functions and types you’ll need to build a reactive system:
§Signals
- Signals:
create_signal
, which returns a (ReadSignal
,WriteSignal
tuple, orcreate_rw_signal
, which returns a signalRwSignal
without this read-write segregation. - Derived Signals: any function that relies on another signal.
- Memos:
create_memo
, which returns aMemo
. - Resources:
create_resource
, which converts anasync
Future
into a synchronousResource
signal. - Triggers:
create_trigger
, creates a purely reactiveTrigger
primitive without any associated state.
§Effects
- Use
create_effect
when you need to synchronize the reactive system with something outside it (for example: logging to the console, writing to a file or local storage) - The Leptos DOM renderer wraps any
Fn
in your template withcreate_effect
, so components you write do not need explicit effects to synchronize with the DOM.
§Example
use leptos_reactive::*;
// creates a new reactive runtime
// this is omitted from most of the examples in the docs
// you usually won't need to call it yourself
let runtime = create_runtime();
// a signal: returns a (getter, setter) pair
let (count, set_count) = create_signal(0);
// calling the getter gets the value
// can be `count()` on nightly
assert_eq!(count.get(), 0);
// calling the setter sets the value
// can be `set_count(1)` on nightly
set_count.set(1);
// or we can mutate it in place with update()
set_count.update(|n| *n += 1);
// a derived signal: a plain closure that relies on the signal
// the closure will run whenever we *access* double_count()
let double_count = move || count.get() * 2;
assert_eq!(double_count(), 4);
// a memo: subscribes to the signal
// the closure will run only when count changes
let memoized_triple_count = create_memo(move |_| count.get() * 3);
// can be `memoized_triple_count()` on nightly
assert_eq!(memoized_triple_count.get(), 6);
// this effect will run whenever `count` changes
create_effect(move |_| {
println!("Count = {}", count.get());
});
// disposes of the reactive runtime
runtime.dispose();
Re-exports§
pub use suspense::GlobalSuspenseContext;
pub use suspense::SuspenseContext;
pub use oco_ref as oco;
pub use callback::*;
Modules§
- callback
- Callbacks define a standard way to store functions and closures. They are useful for component properties, because they can be used to define optional callback functions, which generic props don’t support.
- prelude
- This prelude imports all signal types as well as all signal traits needed to use those types.
- signal_
prelude - This prelude imports all signal types as well as all signal traits needed to use those types.
- suspense
- Types that handle asynchronous data loading via
<Suspense/>
.
Macros§
- update
- Provides a simpler way to use
SignalUpdate::update
. - update_
value - Provides a simpler way to use
StoredValue::update_value
. - with
- Provides a simpler way to use
SignalWith::with
. - with_
value - Provides a simpler way to use
StoredValue::with_value
.
Structs§
- Disposer
- Handle to dispose of a reactive node.
- Effect
- A handle to an effect, can be used to explicitly dispose of the effect.
- Fragment
Data - Represents its pending
<Suspense/>
fragment. - Maybe
Prop - A wrapping type for an optional component prop, which can either be a signal or a
non-reactive value, and which may or may not have a value. In other words, this is
an
Option<MaybeSignal<Option<T>>>
that automatically flattens its getters. - Memo
- An efficient derived reactive value based on other reactive values.
- Owner
- A reactive owner.
- Read
Signal - The getter for a reactive signal.
- Resource
- A signal that reflects the
current state of an asynchronous task, allowing you to integrate
async
Future
s into the synchronous reactive system. - Resource
Id - Unique ID assigned to a
Resource
. - Runtime
Id - Unique ID assigned to a Runtime.
- RwSignal
- A signal that combines the getter and setter into one value, rather than
separating them into a
ReadSignal
and aWriteSignal
. You may prefer this its style, or it may be easier to pass around in a context or as a function argument. - Scoped
Future - Allows running a future that has access to a given scope.
- Selector
- A conditional signal that only notifies subscribers when a change in the source signal’s value changes whether the given function is true.
- Signal
- A wrapper for any kind of readable reactive signal: a
ReadSignal
,Memo
,RwSignal
, or derived signal closure. - Signal
Setter - A wrapper for any kind of settable reactive signal: a
WriteSignal
,RwSignal
, or closure that receives a value and sets a signal depending on it. - Stored
Value - A non-reactive wrapper for any value, which can be created with
store_value
. - Text
Prop - Describes a value that is either a static or a reactive string, i.e.,
a
String
, a&str
, or a reactiveFn() -> String
. - Trigger
- Reactive Trigger, notifies reactive code to rerun.
- Write
Signal - The setter for a reactive signal.
Enums§
- From
Utf8 Error - Error returned from
Oco::try_from
for unsuccessful conversion fromOco<'_, [u8]>
toOco<'_, str>
. - Maybe
Signal - A wrapper for a value that is either
T
orSignal<T>
. - Oco
- “Owned Clones Once”: a smart pointer that can be either a reference, an owned value, or a reference-counted pointer. This is useful for storing immutable values, such as strings, in a way that is cheap to clone and pass around.
- Serialization
Error - Describes errors that can occur while serializing and deserializing data,
typically during the process of streaming
Resource
s from the server to the client.
Traits§
- Into
Signal - Helper trait for converting
Fn() -> T
closures intoSignal<T>
. - Into
Signal Setter - Helper trait for converting
Fn(T)
intoSignalSetter<T>
. - Serializable
- Describes an object that can be serialized to or from a supported format Currently those are JSON and Cbor
- Signal
Dispose - This trait allows disposing a signal before its owner has been disposed.
- Signal
Get - This trait allows getting an owned value of the signals inner type.
- Signal
GetUntracked - Trait implemented for all signal types which you can
get
a value from, such asReadSignal
,Memo
, etc., which allows getting the inner value without subscribing to the current scope. - Signal
Set - This trait allows setting the value of a signal.
- Signal
SetUntracked - Trait implemented for all signal types which you can
set
the inner value, such asWriteSignal
andRwSignal
, which allows setting the inner value without causing effects which depend on the signal from being run. - Signal
Stream - This trait allows converting a signal into a async
Stream
. - Signal
Update - This trait allows updating the inner value of a signal.
- Signal
Update Untracked - This trait allows updating the signals value without causing dependant effects to run.
- Signal
With - This trait allows obtaining an immutable reference to the signal’s inner type.
- Signal
With Untracked - This trait allows getting a reference to the signals inner value without creating a dependency on the signal.
Functions§
- as_
child_ of_ current_ owner - Wraps the given function so that, whenever it is called, it creates a child node owned by whichever reactive node was the owner when it was created, runs the function, and returns a disposer that can be used to dispose of the child later.
- batch
- Batches any reactive updates, preventing effects from running until the whole function has run. This allows you to prevent rerunning effects if multiple signal updates might cause the same effect to run.
- create_
blocking_ resource - Creates a “blocking”
Resource
. When server-side rendering is used, this resource will cause any<Suspense/>
you read it under to block the initial chunk of HTML from being sent to the client. This means that if you set things like HTTP headers or<head>
metadata in that<Suspense/>
, that header material will be included in the server’s original response. - create_
effect - Effects run a certain chunk of code whenever the signals they depend on change.
create_effect
queues the given function to run once, tracks its dependence on any signal values read within it, and reruns the function whenever the value of a dependency changes. - create_
isomorphic_ effect - Creates an effect; unlike effects created by
create_effect
, isomorphic effects will run on the server as well as the client. - create_
local_ resource - Creates a local
Resource
, which is a signal that reflects the current state of an asynchronous task, allowing you to integrateasync
Future
s into the synchronous reactive system. - create_
local_ resource_ with_ initial_ value - Creates a local
Resource
with the given initial value, which will only generate and run aFuture
using thefetcher
when thesource
changes. - create_
memo - Creates an efficient derived reactive value based on other reactive values.
- create_
owning_ memo - Like
create_memo
,create_owning_memo
creates an efficient derived reactive value based on other reactive values, but with two differences: - create_
read_ slice - Takes a memoized, read-only slice of a signal. This is equivalent to the
read-only half of
create_slice
. - create_
render_ effect - Creates an effect exactly like
create_effect
, but runs immediately rather than being queued until the end of the current microtask. This is mostly used inside the renderer but is available for use cases in which scheduling the effect for the next tick is not optimal. - create_
resource - Creates a
Resource
, which is a signal that reflects the current state of an asynchronous task, allowing you to integrateasync
Future
s into the synchronous reactive system. - create_
resource_ with_ initial_ value - Creates a
Resource
with the given initial value, which will only generate and run aFuture
using thefetcher
when thesource
changes. - create_
runtime - Creates a new reactive runtime and sets it as the current runtime.
- create_
rw_ signal - Creates a reactive signal with the getter and setter unified in one value. You may prefer this style, or it may be easier to pass around in a context or as a function argument.
- create_
selector - Creates a conditional signal that only notifies subscribers when a change
in the source signal’s value changes whether it is equal to the key value
(as determined by
PartialEq
.) - create_
selector_ with_ fn - Creates a conditional signal that only notifies subscribers when a change in the source signal’s value changes whether the given function is true.
- create_
signal - Creates a signal, the basic reactive primitive.
- create_
signal_ from_ stream - Creates a signal that always contains the most recent value emitted by a
Stream
. If the stream has not yet emitted a value since the signal was created, the signal’s value will beNone
. - create_
slice - Derives a reactive slice of an
RwSignal
. - create_
trigger - Creates a
Trigger
, a kind of reactive primitive. - create_
write_ slice - Creates a setter to access one slice of a signal. This is equivalent to the
write-only half of
create_slice
. - current_
runtime - The current reactive runtime.
- expect_
context - Extracts a context value of type
T
from the reactive system by traversing it upwards, beginning from the current reactive owner and iterating through its parents, if any. The context value should have been provided elsewhere using provide_context. - on_
cleanup - Creates a cleanup function, which will be run when the current reactive owner is disposed.
- provide_
context - Provides a context value of type
T
to the current reactive node and all of its descendants. This can be consumed usinguse_context
. - queue_
microtask - The microtask is a short function which will run after the current task has completed its work and when there is no other code waiting to be run before control of the execution context is returned to the browser’s event loop.
- run_
as_ child - Runs the given function as a child of the current Owner, once.
- set_
current_ runtime - Sets the current reactive runtime.
- spawn_
local - Spawns and runs a thread-local
Future
in a platform-independent way. - spawn_
local_ with_ current_ owner - Runs a future that has access to the provided
Owner
’s scope context. - spawn_
local_ with_ owner - Runs a future that has access to the provided
Owner
’s scope context. - store_
value - Creates a non-reactive wrapper for any value by storing it within the reactive system.
- try_
batch - Attempts to batch any reactive updates, preventing effects from running until the whole function has run. This allows you to prevent rerunning effects if multiple signal updates might cause the same effect to run.
- try_
spawn_ local_ with_ current_ owner - Runs a future that has access to the provided
Owner
’s scope context. - try_
spawn_ local_ with_ owner - Runs a future that has access to the provided
Owner
’s scope context. - try_
with_ owner - Runs the given code with the given reactive owner.
- untrack
- Suspends reactive tracking while running the given function.
- use_
context - Extracts a context value of type
T
from the reactive system by traversing it upwards, beginning from the current reactive owner and iterating through its parents, if any. The context value should have been provided elsewhere usingprovide_context
. - watch
- A version of
create_effect
that listens to any dependency that is accessed insidedeps
and returns a stop handler. - with_
current_ owner - Wraps the given function so that, whenever it is called, it is run in the reactive scope of whatever the reactive owner was when it was created.
- with_
owner - Runs the given code with the given reactive owner.