Fix: Remove play button from guide example (#1118)
* fix: Remove play button from guide example * Update index.md * update other examples
This commit is contained in:
1 parent
90f80e4dc2
commit
98fc153152
74 files changed
+503
-503
No files matched your search
@@ -6,7 +6,7 @@ Sometimes you want to render different things depending on the state/props. With
|
||||
|
||||
To render different elements based on a condition, you could use an `if-else` statement:
|
||||
|
||||
```rust
|
||||
```rust, no_run
|
||||
{{#include ../../../examples/conditional_rendering.rs:if_else}}
|
||||
```
|
||||
|
||||
@@ -18,7 +18,7 @@ You may have noticed some repeated code in the `if-else` example above. Repeatin
|
||||
|
||||
We can improve this example by splitting up the dynamic parts and inserting them where they are needed.
|
||||
|
||||
```rust
|
||||
```rust, no_run
|
||||
{{#include ../../../examples/conditional_rendering.rs:if_else_improved}}
|
||||
```
|
||||
|
||||
@@ -26,18 +26,17 @@ We can improve this example by splitting up the dynamic parts and inserting them
|
||||
|
||||
Since `Element` is a `Option<VNode>`, components accepting `Element` as a prop can inspect its contents, and render different things based on that. Example:
|
||||
|
||||
```rust
|
||||
```rust, no_run
|
||||
{{#include ../../../examples/component_children_inspect.rs:Clickable}}
|
||||
```
|
||||
|
||||
You can't mutate the `Element`, but if you need a modified version of it, you can construct a new one based on its attributes/children/etc.
|
||||
|
||||
|
||||
## Rendering Nothing
|
||||
|
||||
To render nothing, you can return `None` from a component. This is useful if you want to conditionally hide something:
|
||||
|
||||
```rust
|
||||
```rust, no_run
|
||||
{{#include ../../../examples/conditional_rendering.rs:conditional_none}}
|
||||
```
|
||||
|
||||
@@ -58,7 +57,7 @@ For this, Dioxus accepts iterators that produce `Element`s. So we need to:
|
||||
|
||||
Example: suppose you have a list of comments you want to render. Then, you can render them like this:
|
||||
|
||||
```rust
|
||||
```rust, no_run
|
||||
{{#include ../../../examples/rendering_lists.rs:render_list}}
|
||||
```
|
||||
|
||||
@@ -66,7 +65,7 @@ Example: suppose you have a list of comments you want to render. Then, you can r
|
||||
|
||||
Because of how common it is to render a list of items, Dioxus provides a shorthand for this. Instead of using `.iter`, `.map`, and `rsx`, you can use a `for` loop with a body of rsx code:
|
||||
|
||||
```rust
|
||||
```rust, no_run
|
||||
{{#include ../../../examples/rendering_lists.rs:render_list_for_loop}}
|
||||
```
|
||||
|
||||
|
||||
Reference in new issue
Block a user