yew-alt-html

在Yew中构建Html的备用宏。

示例

此示例表示Yew应用程序的根App组件。它展示了文本节点中的插值、属性中的插值、宏根中的多个节点，以及缩写标签的关闭和使用匹配表达式中的标签。

use yew::prelude::*;
use yew_alt_html::ah;

enum LoadState {
    Loading,
    Failed,
    Loaded,
}

#[function_component]
pub fn App() -> Html {
    let name = "Yew";
    let italic_style = "font-style: italic";

    use LoadState::*;
    let state = Loaded;
    let items = vec![1, 2, 3];
    ah! {
        <h1 style=italic_style>"Hello " name "!"</>
        match state {
            Loading => "Loading...",
            Failed => "Load failed!",
            Loaded => <p>"Welcome to "<code>"yew-alt-html"</>"!"</>,
        }
        <ul>
            for item in items {
                <li>item</>
            }
        </>
    }
}

为什么还需要另一个html!？

这个crate在创建一个更容易使用的宏上进行实验。为此，替换了使用起来略显繁琐的html!语法，直接在ah!中使用值。

以下问题应该通过此crate解决

• 即使值是简单的文字，也需要在标签内使用{}。
• 需要在{}中包装属性（请注意，缩写仍然使用{变量}）。
• 在关闭标签时必须重复泛型（Yew专用）和标签名称（虽然不是非常HTML，但仍然值得考虑）。
• 在宏根中使用多个节点时，必须使用片段<></>。
• 不能像使用if一样使用match。
• 繁琐的{ for ... }表示法（在0.4.0中修复）。