dioxus/packages/hooks/README.md
Evan Almloff 0127501dbf
Improve inline docs (#2460)
Improve inline docs

* improve incorrect event handler return error message

* Improve event handler docs

* document the eval functions

* document spawn and common spawn errors

* fix event handler docs

* add notes about how you use attributes and elements in rsx

* add doc aliases for attributes and events we rename

* add some more aliases for common search terms

* don't doc ignore any public examples in core

* don't ignore public doc examples in ssr

* don't ignore examples in the dioxus package readme

* add a warning when you launch without a renderer enabled

* fix some outdated element docs

* add a bunch of examples to resource

* add notes about desktop events

* add more docs for use_resource

* add on_unimplemented hint to Dependency

* fix some unresolved links

* add examples to each of the router traits

* add not implemented errors for router traits

* add an example to the routable trait

* expand rsx macro docs

* improve memo docs

* update the dioxus readme

* mention dioxus crate features in the docs

* fix a bunch of doc tests

* fix html doc tests

* fix router doc tests

* fix dioxus signals doc tests

* fix dioxus ssr doc tests

* fix use_future example in the hooks cheat sheet

* add a javascript alias for eval

* fix hook explanation values

* remove unused embed-doc-image dependency
2024-06-06 18:15:17 -07:00

5.7 KiB

Dioxus Hooks

Crates.io MIT licensed Build Status Discord chat

Website | Guides | API Docs | Chat

Overview

dioxus-hooks includes some basic useful hooks for Dioxus such as:

  • use_signal
  • use_effect
  • use_resource
  • use_memo
  • use_coroutine

Unlike React, none of these hooks are foundational since they all build off the primitive use_hook. You can extend these hooks with custom hooks in your own code. If you think they would be useful for the broader community, you can open a PR to add your hook to the Dioxus Awesome list.

State Cheat Sheet

If you aren't sure what hook to use, you can use this cheat sheet to help you decide:

State Location

Depending on where you need to access the state, you can put your state in one of three places:

Location Where can you access the state? Recommended for Libraries? Examples
Hooks Any components you pass it to use_signal(|| 0), use_memo(|| state() * 2)
Context Any child components use_context_provider(|| Signal::new(0)), use_context::<Signal<i32>>()
Global Anything in your app Signal::global(|| 0)

Derived State

If you don't have an initial value for your state, you can derive your state from other states with a closure or asynchronous function:

Hook Reactive (reruns when dependencies change) Async Memorizes Output Example
use_memo use_memo(move || count() * 2)
use_resource use_resource(move || reqwest::get(format!("/users/{user_id}")))
use_future use_future(move || println!("{:?}", reqwest::get(format!("/users/{user_id}"))))

Persistent State

The core hooks library doesn't provide hooks for persistent state, but you can extend the core hooks with hooks from dioxus-sdk and the dioxus-router to provide persistent state management.

State Sharable Example
use_persistent use_persistent("unique_key", move || initial_state)
Router<Route> {} #[derive(Routable, Clone, PartialEq)] enum Route { #[route("/user/:id")] Homepage { id: u32 } }

Contributing

  • Report issues on our issue tracker.
  • Join the discord and ask questions!

License

This project is licensed under the MIT license.

Unless you explicitly state otherwise, any contribution intentionally submitted for inclusion in Dioxus by you shall be licensed as MIT without any additional terms or conditions.