complex.rsx 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. rsx! {
  2. // Complex nesting with components
  3. button {
  4. class: "flex items-center pl-3 py-3 pr-2 text-gray-500 hover:bg-indigo-50 rounded",
  5. onclick: move |evt| {
  6. show_user_menu.set(!show_user_menu.get());
  7. evt.cancel_bubble();
  8. },
  9. onclick: move |evt| show_user_menu.set(!show_user_menu.get()),
  10. span { class: "inline-block mr-4", icons::icon_14 {} }
  11. span { "Settings" }
  12. }
  13. // Complex nesting with handlers
  14. li {
  15. Link { class: "flex items-center pl-3 py-3 pr-4 {active_class} rounded", to: "{to}",
  16. span { class: "inline-block mr-3", icons::icon_0 {} }
  17. span { "{name}" }
  18. children.is_some().then(|| rsx! {
  19. span {
  20. class: "inline-block ml-auto hover:bg-gray-500",
  21. onclick: move |evt| {
  22. // open.set(!open.get());
  23. evt.cancel_bubble();
  24. },
  25. icons::icon_8 {}
  26. }
  27. })
  28. }
  29. div { class: "px-4",
  30. is_current.then(|| rsx!{ children })
  31. }
  32. }
  33. // No nesting
  34. Component {
  35. adsasd: "asd",
  36. onclick: move |_| {
  37. let blah = 120;
  38. }
  39. }
  40. // Component path
  41. my::thing::Component {
  42. adsasd: "asd",
  43. onclick: move |_| {
  44. let blah = 120;
  45. }
  46. }
  47. }