Leptos中的Lucide图标

此库提供了用于Lucide SVG的Leptos组件。

安装

从项目目录中，使用以下命令：

cargo add leptos_lucide

或者，将以下行添加到您的 Cargo.toml

leptos_lucide = "0.1.0"

用法

在父组件中创建一个 LucideAttributes 结构体。然后，使用 provide_context() 将属性传递给任何Lucide图标。

方法1: new_with_attributes()

use leptos::*;
use leptos_lucide::icons::*;

#[component]
pub fn SomeComponent() -> impl IntoView {
    let attributes = LucideAttributes::new_with_attributes(
        "animate-pulse", 
        "http://www.w3.org/2000/svg",
        24, 
        24, 
        "0 0 24 24", 
        "#ffffff", 
        "rgba(0,0,0,0.69)", 
        1.625,
        "round",
        "round"
    );
    let attributes_ctx = LucideAttributesCtx(RwSignal::new(attributes));
    provide_context(attributes_ctx);

    view! {
        <Wallet/>
        <WalletCards/>
        <WalletMinimal/>
    }
}

方法2: new() - 构建模式

use leptos::*;
use leptos_lucide::icons::*;

#[component]
pub fn ExampleComponent() -> impl IntoView {
    let attributes = LucideAttributes::new()
        .set_height(24)
        .set_width(96)
        .set_stroke_width(1.625);
    let attributes_ctx = LucideAttributesCtx(RwSignal::new(attributes));
    provide_context(attributes_ctx);
    
    view! {
        <Wallet/>
        <WalletCards/>
        <WalletMinimal/>
    }
}