Crate dioxus_core

🌗🚀 📦 Dioxus

A concurrent, functional, virtual DOM for Rust

Dioxus: a concurrent, functional, reactive virtual dom for any renderer in Rust.

This crate aims to maintain a uniform hook-based, renderer-agnostic UI framework for cross-platform development.

Components

The base unit of Dioxus is the component. Components can be easily created from just a function - no traits required:

use dioxus_core::prelude::*;

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

fn Example(ctx: &mut Context<Props>) -> VNode {
    html! { <div> "Hello {ctx.props.name}!" </div> }
}

Components need to take a “Context” parameter which is generic over some properties. This defines how the component can be used and what properties can be used to specify it in the VNode output. Component state in Dioxus is managed by hooks - if you’re new to hooks, check out the hook guide in the official guide.

Components can also be crafted as static closures, enabling type inference without all the type signature noise:

use dioxus_core::prelude::*;

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

static Example: FC<Props> = |ctx, props| {
    html! { <div> "Hello {props.name}!" </div> }
}

If the properties struct is too noisy for you, we also provide a macro that converts variadic functions into components automatically.

use dioxus_core::prelude::*;

#[fc]
static Example: FC = |ctx, name: String| {
    html! { <div> "Hello {name}!" </div> }
}

Hooks

Dioxus uses hooks for state management. Hooks are a form of state persisted between calls of the function component. Instead of using a single struct to store data, hooks use the “use_hook” building block which allows the persistence of data between function component renders.

This allows functions to reuse stateful logic between components, simplify large complex components, and adopt more clear context subscription patterns to make components easier to read.

Supported Renderers

Instead of being tightly coupled to a platform, browser, or toolkit, Dioxus implements a VirtualDOM object which can be consumed to draw the UI. The Dioxus VDOM is reactive and easily consumable by 3rd-party renderers via the Patch object. See Implementing a Renderer and the StringRenderer classes for information on how to implement your own custom renderer. We provide 1st-class support for these renderers:

• dioxus-desktop (via WebView)
• dioxus-web (via WebSys)
• dioxus-ssr (via StringRenderer)
• dioxus-liveview (SSR + StringRenderer)

Modules

builder
changelist	Changelist
component	This file handles the supporting infrastructure for the Component trait and Properties which makes it possible for components to be used within Nodes.
context
debug_renderer	Debug virtual doms! This renderer comes built in with dioxus core and shows how to implement a basic renderer.
dodriodiff
error
events	Virtual Events This module provides a wrapping of platform-specific events with a list of events easier to work with.
hooks	Useful, foundational hooks that 3rd parties can implement. Currently implemented:
nodebuilder	Helpers for building virtual DOM VNodes.
nodes	Virtual Node Support VNodes represent lazily-constructed VDom trees that support diffing and event handlers.
prelude	Re-export common types for ease of development use. Essential when working with the html! macro
scope
validation
virtual_dom