Creates a Component
the sample of a component
HelloComponent
Kagura recomends to create a component by file. Basically, file and component have same name.
use kagura::pelude::*;
use nusa::prelude::*;
pub struct Props {}
pub enum Msg {}
pub enum On {}
pub struct HelloComponent {}
impl Component for HelloComponent {
type Props = Props;
type Msg = Msg;
type Event = On;
}
impl HtmlComponent for HelloComponent {}
impl Constructor for HelloComponent {
fn constructor(_props: Self::Props) -> Self {
Self {}
}
}
impl Update for HelloComponent {}
impl Render<Html> for HelloComponent {
type Children = ();
fn render(&self, _children: Self::Children) -> Html {
Html::h1(
Attributes::new(),
Events::new(),
vec![Html::text("Hello Component")]
)
}
}Mounts a Component
extern crate js_sys;
extern crate kagura;
extern crate nusa;
extern crate wasm_bindgen;
extern crate wasm_bindgen_futures;
extern crate web_sys;
use nusa::html::html_element::Attributes;
use nusa::html::html_element::Events;
use nusa::Html;
use wasm_bindgen::prelude::*;
mod hello_component;
use hello_component::HelloComponent;
#[wasm_bindgen(start)]
pub fn main() {
wasm_bindgen_futures::spawn_local(kagura::Runtime::run(nusa::dom_node::BasicDomNode::new(
entry_point(),
|this| {
vec![HelloComponent::new(
this,
None,
hello_component::Props {},
Sub::none(),
()
)]
},
)));
}
fn entry_point() -> web_sys::Node {
web_sys::window()
.unwrap()
.document()
.unwrap()
.get_element_by_id("app")
.unwrap()
.into()
}Last updated