update the dioxus cratesio readme, add many more examples (#5501)

* update the dioxus cratesio readme

* fix example

* fix header

* add a bunch more examples

examples/04-managing-state/vec_signal.rs

@@ -0,0 +1,62 @@
+//! Signals that hold a collection.
+//!
+//! `Signal<Vec<T>>` is the workhorse for dynamic lists. Dioxus exposes `push`, `pop`,
+//! `remove`, `clear`, and `retain` directly on the signal so you don't have to call
+//! `.write()` for the common cases. For anything else, `.write()` returns a guard that
+//! derefs to the underlying `Vec`.
+
+use dioxus::prelude::*;
+
+fn main() {
+    dioxus::launch(app);
+}
+
+fn app() -> Element {
+    let mut todos = use_signal(|| vec!["learn dioxus".to_string(), "build an app".to_string()]);
+    let mut draft = use_signal(String::new);
+
+    rsx! {
+        h1 { "Todo list" }
+
+        input {
+            placeholder: "New todo...",
+            value: "{draft}",
+            oninput: move |evt| draft.set(evt.value()),
+        }
+        button {
+            onclick: move |_| {
+                if !draft.read().is_empty() {
+                    todos.push(draft());
+                    draft.set(String::new());
+                }
+            },
+            "Add"
+        }
+
+        ul {
+            for (index, todo) in todos.read().iter().enumerate() {
+                li { key: "{index}",
+                    "{todo} "
+                    button {
+                        onclick: move |_| { todos.remove(index); },
+                        "×"
+                    }
+                }
+            }
+        }
+
+        button { onclick: move |_| todos.clear(), "Clear all" }
+        button {
+            // `.retain` accepts a predicate — here we drop any todo containing "x"
+            onclick: move |_| todos.retain(|t| !t.contains('x')),
+            "Drop todos with 'x'"
+        }
+        button {
+            // For anything custom, `.write()` gives a mutable guard to the Vec
+            onclick: move |_| todos.write().sort(),
+            "Sort alphabetically"
+        }
+
+        p { "{todos.len()} todo(s)" }
+    }
+}