2021-03-01 05:16:48 +00:00
|
|
|
use dioxus_core::prelude::*;
|
|
|
|
|
|
|
|
fn main() {}
|
|
|
|
|
2021-03-08 02:28:20 +00:00
|
|
|
trait SProps {}
|
|
|
|
|
|
|
|
trait Comp {
|
|
|
|
type Props;
|
|
|
|
}
|
|
|
|
|
|
|
|
impl<T> Comp for FC<T> {
|
|
|
|
type Props = T;
|
|
|
|
}
|
|
|
|
|
|
|
|
fn test() {
|
|
|
|
// let g: FC<ButtonProps> = CustomButton;
|
|
|
|
}
|
|
|
|
|
|
|
|
trait Render {
|
|
|
|
fn render(ctx: Context, props: &Self) -> DomTree;
|
|
|
|
}
|
2021-03-02 03:55:20 +00:00
|
|
|
// include as much as you might accept
|
2021-03-08 02:28:20 +00:00
|
|
|
struct Button<'a> {
|
2021-03-02 03:55:20 +00:00
|
|
|
onhover: Option<&'a dyn Fn()>,
|
|
|
|
}
|
|
|
|
|
2021-03-08 02:28:20 +00:00
|
|
|
impl Render for Button<'_> {
|
2021-03-11 00:42:31 +00:00
|
|
|
fn render(ctx: Context, _props: &Self) -> DomTree {
|
|
|
|
let _onfocus = move |_evt: ()| log::debug!("Focused");
|
2021-03-08 02:28:20 +00:00
|
|
|
|
|
|
|
// todo!()
|
|
|
|
ctx.render(rsx! {
|
|
|
|
button {
|
|
|
|
// ..props.attrs,
|
|
|
|
class: "abc123",
|
|
|
|
// style: { a: 2, b: 3, c: 4 },
|
2021-03-11 00:42:31 +00:00
|
|
|
onclick: move |_evt| {
|
2021-03-08 02:28:20 +00:00
|
|
|
// log::info("hello world");
|
|
|
|
},
|
|
|
|
// Custom1 { a: 123 }
|
|
|
|
// Custom2 { a: 456, "abc", h1 {"1"}, h2 {"2"} }
|
|
|
|
// Custom3 { a: "sometext goes here" }
|
|
|
|
// Custom4 { onclick: |evt| log::info("click") }
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
2021-03-01 05:16:48 +00:00
|
|
|
}
|
2021-03-02 03:55:20 +00:00
|
|
|
|
2021-03-08 02:28:20 +00:00
|
|
|
// #[fc]
|
|
|
|
// fn Button(ctx: Context, onhover: Option<&dyn Fn()>) -> DomTree {}
|
|
|
|
|
2021-03-02 03:55:20 +00:00
|
|
|
// 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"
|