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", is_current.then(|| rsx!{ children }) }
  30. }
  31. // No nesting
  32. Component {
  33. adsasd: "asd",
  34. onclick: move |_| {
  35. let blah = 120;
  36. }
  37. }
  38. // Component path
  39. my::thing::Component {
  40. adsasd: "asd",
  41. onclick: move |_| {
  42. let blah = 120;
  43. }
  44. }
  45. div { asdbascasdbasd, asbdasbdabsd, asbdabsdbasdbas }
  46. }