swaits/dioxus
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat: parse custom rsx syntax

Browse Source
This commit is contained in:
Jonathan Kelley committed 2021-03-01 22:55:20 -05:00
1 parent 114a446c0a
commit da00df6688
4 files changed
+271 -172
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/core/examples/rsx_usage.rs
+98 -80
View File
@@ -2,88 +2,106 @@ use dioxus_core::prelude::*;
fn main() {}
fn Example(ctx: Context, props: ()) -> DomTree {
// include as much as you might accept
struct ButtonProps<'a> {
onhover: Option<&'a dyn Fn()>,
// // A list of any attrs
// attrs: AttrList<'a>,
}
fn CustomButton(ctx: Context, props: ButtonProps) -> DomTree {
let onfocus = move |evt: ()| log::debug!("Focused");
ctx.render(rsx! {
div {
<h1 tag="type" abc=123 class="big..."> "title1" "title2" </h1>
<h1 alsd> alkjsd </h1>
h1 { tag: "type", abc: 123, class: "big small wide short",
"title1"
"title1"
"title1"
"title"
}
h1 ("title") {
tag: "type",
abc: 123,
class: "big small wide short",
}
// <button
// class="inline-block py-4 px-8 mr-6 leading-none text-white bg-indigo-600 hover:bg-indigo-900 font-semibold rounded shadow"
// onclick={move |_| set_name("jill")}
// onclick={move |_| set_name("jill")}
// >
// "Jill!"
// </button>
button {
// ..props.attrs,
class: "abc123",
style: { a: 2, b: 3, c: 4 },
onclick: move |evt| {
log::info("hello world");
},
onfocus,
onhover: props.onhover,
button { "Jill!",
class: "inline-block py-4 px-8 mr-6 leading-none text-white bg-indigo-600 hover:bg-indigo-900 font-semibold rounded shadow"
onclick: move |_| set_name("jill"),
onclick: move |_| set_name("jill"),
}
button {
class: "inline-block py-4 px-8 mr-6 leading-none text-white bg-indigo-600 hover:bg-indigo-900 font-semibold rounded shadow"
onclick: move |_| set_name("jill"),
onclick: move |_| set_name("jill"),
// this is valid
"Jill!",
// this is also valid
{"Jill!"}
}
h1 { "Text", class: "inline-block py-4 px-8 mr-6 leading-none" }
// <h1 class="inline-block py-4 px-8 mr-6 leading-none">
// "Text"
// </h1>
h1 {
div {
h1 {}
h2 {}
Brick {}
p {}
p {
tag: "type",
abc: 123,
enabled: true,
class: "big small wide short",
a { "abcder" },
h2 { "whatsup", class: "abc-123" },
CustomComponent { a: 123, b: 456, key: "1" },
}
div { class: "big small wide short",
div {},
div {},
div {},
div {},
}
}
}
h2 {}
h3 {}
"abcd123"
Custom1 { a: 123 }
Custom2 { a: 456, "abc", h1 {"1"}, h2 {"2"} }
Custom3 { a: "sometext goes here" }
Custom4 { onclick: |evt| log::info("click") }
}
})
}
// h1 {
// tag: "type", abc: 123, class: "big small wide short",
// "title1"
// "title1"
// "title1"
// "title"
// }
// h1 ("title") {
// tag: "type",
// abc: 123,
// class: "big small wide short",
// }
// // <button
// // class="inline-block py-4 px-8 mr-6 leading-none text-white bg-indigo-600 hover:bg-indigo-900 font-semibold rounded shadow"
// // onclick={move |_| set_name("jill")}
// // onclick={move |_| set_name("jill")}
// // >
// // "Jill!"
// // </button>
// button { "Jill!",
// class: "inline-block py-4 px-8 mr-6 leading-none text-white bg-indigo-600 hover:bg-indigo-900 font-semibold rounded shadow"
// onclick: move |_| set_name("jill"),
// onclick: move |_| set_name("jill"),
// }
// button {
// class: "inline-block py-4 px-8 mr-6 leading-none text-white bg-indigo-600 hover:bg-indigo-900 font-semibold rounded shadow"
// onclick: move |_| set_name("jill"),
// onclick: move |_| set_name("jill"),
// // this is valid
// "Jill!",
// // this is also valid
// {"Jill!"}
// }
// h1 { "Text", class: "inline-block py-4 px-8 mr-6 leading-none" }
// // <h1 class="inline-block py-4 px-8 mr-6 leading-none">
// // "Text"
// // </h1>
// h1 {
// div {
// h1 {}
// h2 {}
// Brick {}
// p {}
// p {
// tag: "type",
// abc: 123,
// enabled: true,
// class: "big small wide short",
// a { "abcder" },
// h2 { "whatsup", class: "abc-123" },
// CustomComponent { a: 123, b: 456, key: "1" },
// }
// div { class: "big small wide short",
// div {},
// div {},
// div {},
// div {},
// }
// }
// }
// h2 {}
// h3 {}
// "abcd123"