Link Blade 组件

简介

link 组件用于渲染可点击的链接以执行操作：

<x-filament::link :href="route('users.create')">
    New user
</x-filament::link>

将链接用作按钮

默认情况下，链接底层的 HTML 标签是 <a>。可使用 tag 属性将其改为 <button> 标签：

<x-filament::link
    wire:click="openNewUserModal"
    tag="button"
>
    New user
</x-filament::link>

设置链接尺寸

默认情况下，链接的尺寸为「中等」。可使用 size 属性将其设为「小」「大」「超大」或「特大」：

<x-filament::link size="sm">
    New user
</x-filament::link>

<x-filament::link size="lg">
    New user
</x-filament::link>

<x-filament::link size="xl">
    New user
</x-filament::link>

<x-filament::link size="2xl">
    New user
</x-filament::link>

设置链接字重

默认情况下，链接的字重为 semibold。可使用 weight 属性将其设为 thin、extralight、light、normal、medium、bold、extrabold 或 black：

<x-filament::link weight="thin">
    New user
</x-filament::link>

<x-filament::link weight="extralight">
    New user
</x-filament::link>

<x-filament::link weight="light">
    New user
</x-filament::link>

<x-filament::link weight="normal">
    New user
</x-filament::link>

<x-filament::link weight="medium">
    New user
</x-filament::link>

<x-filament::link weight="semibold">
    New user
</x-filament::link>
   
<x-filament::link weight="bold">
    New user
</x-filament::link>

<x-filament::link weight="black">
    New user
</x-filament::link>

或者，你可以传入自定义 CSS 类来定义字重：

<x-filament::link weight="md:font-[650]">
    New user
</x-filament::link>

更改链接颜色

默认情况下，链接的颜色为「primary」。可使用 color 属性将其改为 danger、gray、info、success 或 warning：

<x-filament::link color="danger">
    New user
</x-filament::link>

<x-filament::link color="gray">
    New user
</x-filament::link>

<x-filament::link color="info">
    New user
</x-filament::link>

<x-filament::link color="success">
    New user
</x-filament::link>

<x-filament::link color="warning">
    New user
</x-filament::link>

为链接添加图标

可使用 icon 属性为链接添加图标：

<x-filament::link icon="heroicon-m-sparkles">
    New user
</x-filament::link>

也可以使用 icon-position 属性，将图标位置从文本之前改为文本之后：

<x-filament::link
    icon="heroicon-m-sparkles"
    icon-position="after"
>
    New user
</x-filament::link>

为链接添加提示

可使用 tooltip 属性为链接添加提示：

<x-filament::link tooltip="Register a user">
    New user
</x-filament::link>

为链接添加徽章

可使用 badge 插槽在链接上渲染徽章：

<x-filament::link>
    Mark notifications as read

    <x-slot name="badge">
        3
    </x-slot>
</x-filament::link>

可使用 badge-color 属性更改徽章颜色：

<x-filament::link badge-color="danger">
    Mark notifications as read

    <x-slot name="badge">
        3
    </x-slot>
</x-filament::link>