hashira

基于yew构建的服务器端渲染框架。

入门

要使用 hashira 创建项目，您需要安装 CLI。

cargo install --force hashira-cli

创建新项目

使用 hashira new 可以创建新项目，CLI将提示您选择模板和项目名称。

您还可以使用快捷方式创建新项目

hashira new --{{template}} --name {{name}}

目前可用的模板有

• actix-web
• axum
• rocket
• deno

将来还会添加更多。或者如果您想为自己的项目创建适配器，请查看代码，大多数模板只是使用一个启动服务器的适配器，您可以在 /packages/adapters 中查看适配器。

此项目仍处于alpha版本

hashira 仍处于alpha版本，这意味着

• 一些功能可能不完整
• 一些功能可能会被移除

功能

SSR（服务器端渲染）

允许在服务器上渲染您的 yew 组件，并从服务器端传递属性。

async fn render_page(ctx: RenderContext) -> Result<Response> {
    let products = get_products().await?;
    let res = ctx.render_with_props(ProductsPageProps { products }).await;
    Ok(res)
}

#[page_component("/products", render = "render_page")]
fn ProductsPage(props: &ProductsPageProps) -> yew::Html {
    yew::html! {
        // ...
    }
}

服务器操作

从您的组件中执行服务器端的代码。

struct CreateProduct {
    name: String,
    price: i64,
    description: Option<String>
}

#[action("/api/products/create")]
async fn CreateProductAction(form: Form<CreateProduct>) -> Json<Product> {
    // server side logic
}

#[page_component("/products/add", render = "...")]
fn CreateProductPage() -> yew::Html {
    let action = use_action();

    if action.is_loading() {
        return yew::html! {
            "Creating product..."
        };
    }

    yew::html! {
        <Form<CreateProductAction> action={action.clone()}>
            <input name="name" required={true} />
            <input name="price" required={true} />
            <textarea name="description" rows={4}></textarea>
        </Form<CreateProductAction>>
    }
}

提取器

渲染函数和服务器操作允许注入实现 FromRequest 的任何参数。

#[action("/api/products/create")]
async fn CreateProductAction(
    form: Form<CreateProduct>,
    headers: HeadersMap,
    method: Method,
    Inject(pool): Inject<MySqlPool>) -> Json<Product> {
    // server side logic
}