Render hooks - 高级

简介

Filament 允许你在框架视图的各个节点渲染 Blade 内容。这对于让插件将 HTML 注入到框架很有用。同时，由于 Filament 不推荐发布视图，因为会破坏性更新的风险，因此这也对用户有帮助。

注册渲染钩子

要注册渲染钩子，你可以在服务提供者或者中间件中调用 FilamentView::registerRenderHook()。第一个参数是钩子名称，第二个参数是返回要渲染内容的回调函数：

use Filament\Support\Facades\FilamentView;
use Filament\View\PanelsRenderHook;
use Illuminate\Support\Facades\Blade;

FilamentView::registerRenderHook(
    PanelsRenderHook::BODY_START,
    fn (): string => Blade::render('@livewire(\'livewire-ui-modal\')'),
);

你也可以从文件中渲染视图内容：

use Filament\Support\Facades\FilamentView;
use Filament\View\PanelsRenderHook;
use Illuminate\Contracts\View\View;

FilamentView::registerRenderHook(
    PanelsRenderHook::BODY_START,
    fn (): View => view('impersonation-banner'),
);

可用渲染钩子

面板构造器渲染钩子

use Filament\View\PanelsRenderHook;

PanelsRenderHook::AUTH_LOGIN_FORM_AFTER - 登录表单之后
PanelsRenderHook::AUTH_LOGIN_FORM_BEFORE - 登录表单之前
PanelsRenderHook::AUTH_PASSWORD_RESET_REQUEST_FORM_AFTER - 密码重置请求表单之后
PanelsRenderHook::AUTH_PASSWORD_RESET_REQUEST_FORM_BEFORE - 密码重置请求表单之前
PanelsRenderHook::AUTH_PASSWORD_RESET_RESET_FORM_AFTER - 密码重置表单之后
PanelsRenderHook::AUTH_PASSWORD_RESET_RESET_FORM_BEFORE - 密码重置表单之前
PanelsRenderHook::AUTH_REGISTER_FORM_AFTER - 注册表单之后
PanelsRenderHook::AUTH_REGISTER_FORM_BEFORE - 注册表单之前
PanelsRenderHook::BODY_END - </body> 之前
PanelsRenderHook::BODY_START - <body> 之后
PanelsRenderHook::CONTENT_AFTER - 页面内容之后
PanelsRenderHook::CONTENT_BEFORE - 页面内容之前
PanelsRenderHook::CONTENT_END - 页面内容之后，<main> 标签内
PanelsRenderHook::CONTENT_START - 页面内容之前，<main> 标签内
PanelsRenderHook::FOOTER - 页面的 Footer
PanelsRenderHook::GLOBAL_SEARCH_AFTER - 全局搜索容器之后，在顶部导航栏内
PanelsRenderHook::GLOBAL_SEARCH_BEFORE - 全局搜索容器之前，在顶部导航栏内、
PanelsRenderHook::GLOBAL_SEARCH_END - 全局搜索容器尾部
PanelsRenderHook::GLOBAL_SEARCH_START - 全局搜索容器起始位置
PanelsRenderHook::HEAD_END - </head> 之前
PanelsRenderHook::HEAD_START - <head> 之后
PanelsRenderHook::LAYOUT_END - 布局容器的末尾，也可以限定作用域到页面类
PanelsRenderHook::LAYOUT_START - 布局容器的开始位置，也可以限定作用域到页面类、
PanelsRenderHook::PAGE_END - 页面内容容器的结尾，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_FOOTER_WIDGETS_AFTER - 页面底部 Widget 之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_FOOTER_WIDGETS_BEFORE - 页面底部 Widget 之前，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_FOOTER_WIDGETS_END - 页面底部 Widget 末尾，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_FOOTER_WIDGETS_START - 页面底部 Widget 起始位置，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_HEADER_ACTIONS_AFTER - 页面 Header Action 之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_HEADER_ACTIONS_BEFORE - 页面 Header Action 之前，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_HEADER_HEADING_AFTER - 页面 Header 标题之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_HEADER_HEADING_BEFORE - 页面 Header 标题之前，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_HEADER_WIDGETS_AFTER - 页面 Header Widget 之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_HEADER_WIDGETS_BEFORE - 页面 Header Widget 之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_START - 页面内容容器的起始位置，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_END_AFTER - 在页面子导航“结束”侧边栏位置之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_END_BEFORE - 在页面子导航“结束”侧边栏位置之前，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_SELECT_AFTER - 在页面子导航选择(适用于移动端)之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_SELECT_BEFORE - 在页面子导航选择(适用于移动端)之前，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_SIDEBAR_AFTER - 在页面子导航侧边栏之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_SIDEBAR_BEFORE - 在页面子导航侧边栏之前，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_START_AFTER - 在页面子导航“开始”侧边栏位置之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_START_BEFORE - 在页面子导航“开始”侧边栏位置之前，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_TOP_AFTER - 在页面子导航“顶部”标签位置之后，也可以限定作用域到页面或资源类
PanelsRenderHook::PAGE_SUB_NAVIGATION_TOP_BEFORE - 在页面子导航“顶部”标签位置之前，也可以限定作用域到页面或资源类
PanelsRenderHook::RESOURCE_PAGES_LIST_RECORDS_TABLE_AFTER - 资源表格之后，也可以限定作用域到页面或资源类
PanelsRenderHook::RESOURCE_PAGES_LIST_RECORDS_TABLE_BEFORE - 资源表格之前，也可以限定作用域到页面或资源类
PanelsRenderHook::RESOURCE_PAGES_LIST_RECORDS_TABS_END - 过滤器选项卡的末尾(最后一个选项卡之后)，也可以限定作用域到页面或资源类
PanelsRenderHook::RESOURCE_PAGES_LIST_RECORDS_TABS_START - 过滤器选项卡的起始位置(第一个选项卡之前)，也可以限定作用域到页面或资源类
PanelsRenderHook::RESOURCE_PAGES_MANAGE_RELATED_RECORDS_TABLE_AFTER - 关联管理器表格之后，也可以限定作用域到页面或资源类
PanelsRenderHook::RESOURCE_PAGES_MANAGE_RELATED_RECORDS_TABLE_BEFORE - 关联管理器表格之前，也可以限定作用域到页面或资源类
PanelsRenderHook::RESOURCE_RELATION_MANAGER_AFTER - 关联管理器表格之后，也可以限定作用域到页面或资源管理器类
PanelsRenderHook::RESOURCE_RELATION_MANAGER_BEFORE - 关联管理器表格之前，也可以限定作用域到页面或资源管理器类
PanelsRenderHook::RESOURCE_TABS_END - 资源选项卡尾部(最后一个选项卡之后)，也可以限定作用域到页面或资源类
PanelsRenderHook::RESOURCE_TABS_START - 资源选项卡开始位置(第一个选项卡之前)，也可以限定作用域到页面或资源类
PanelsRenderHook::SCRIPTS_AFTER - 脚本定义之后
PanelsRenderHook::SCRIPTS_BEFORE - 脚本定义之前
PanelsRenderHook::SIDEBAR_LOGO_AFTER - 侧边栏 Logo 之后
PanelsRenderHook::SIDEBAR_LOGO_BEFORE - 侧边栏 Logo 之前
PanelsRenderHook::SIDEBAR_NAV_END - 侧边栏， </nav> 之前
PanelsRenderHook::SIDEBAR_NAV_START - 侧边栏， <nav> 之后
PanelsRenderHook::SIMPLE_LAYOUT_END - 简单布局容器尾部，也可以限定作用域到页面类
PanelsRenderHook::SIMPLE_LAYOUT_START - 简单布局容器起始位置，也可以限定作用域到页面类
PanelsRenderHook::SIMPLE_PAGE_END - 简单页面内容容器尾部，也可以限定作用域到页面类
PanelsRenderHook::SIMPLE_PAGE_START - 简单页面内容容器起始位置，也可以限定作用域到页面类
PanelsRenderHook::SIDEBAR_FOOTER - 固定在侧边栏底部，内容下方
PanelsRenderHook::STYLES_AFTER - 样式定义之后
PanelsRenderHook::STYLES_BEFORE - 样式定义之前
PanelsRenderHook::SIDEBAR_START - 侧边栏容器起始位置
PanelsRenderHook::TENANT_MENU_AFTER - 在租户菜单之后
PanelsRenderHook::TENANT_MENU_BEFORE - 在租户菜单之前
PanelsRenderHook::TOPBAR_AFTER - 顶部栏下方
PanelsRenderHook::TOPBAR_BEFORE - 顶部栏上方
PanelsRenderHook::TOPBAR_END - 顶部栏容器尾部
PanelsRenderHook::TOPBAR_LOGO_AFTER - 顶部栏 Logo 之后
PanelsRenderHook::TOPBAR_LOGO_BEFORE - 顶部栏 Logo 之前
PanelsRenderHook::TOPBAR_START - 顶部栏容器起始位置
PanelsRenderHook::USER_MENU_AFTER - 用户菜单之后
PanelsRenderHook::USER_MENU_BEFORE - 用户菜单之前
PanelsRenderHook::USER_MENU_PROFILE_AFTER - 在用户菜单中的个人资料项之后
PanelsRenderHook::USER_MENU_PROFILE_BEFORE - 在用户菜单中的个人资料项之前

表格构造器渲染钩子

所有这些渲染钩子都可作用于所有表格 Livewire 组件类。使用面板时，这些类可能是资源的列表页或者管理页、或者关联管理器。表格 Widget 也是 Livewire 组件类。

use Filament\Tables\View\TablesRenderHook;

TablesRenderHook::FILTER_INDICATORS - Replace the existing filter indicators, receives filterIndicators data as array<Filament\Tables\Filters\Indicator>
TablesRenderHook::HEADER_CELL - Replace the existing header cells, receives the Filament\Tables\Columns\Column object as column and isReordering in the data.
TablesRenderHook::SELECTION_INDICATOR_ACTIONS_AFTER - 在选择指示栏的“全选(Select All)“或者”取消全选(Deselect All)“操作按钮之后
TablesRenderHook::SELECTION_INDICATOR_ACTIONS_BEFORE - 在选择指示栏的“全选(Select All)“或者”取消全选(Deselect All)“操作按钮之前
TablesRenderHook::HEADER_AFTER - Header 容器之后
TablesRenderHook::HEADER_BEFORE - Header 容器之前
TablesRenderHook::TOOLBAR_AFTER - 在工具栏容器之后
TablesRenderHook::TOOLBAR_BEFORE - 在工具栏容器之前
TablesRenderHook::TOOLBAR_END - 在工具栏尾部
TablesRenderHook::TOOLBAR_GROUPING_SELECTOR_AFTER - 在分组选择器之后
TablesRenderHook::TOOLBAR_GROUPING_SELECTOR_BEFORE - 在分组选择器之前
TablesRenderHook::TOOLBAR_REORDER_TRIGGER_AFTER - 在重新排序(reorder)触发器之后
TablesRenderHook::TOOLBAR_REORDER_TRIGGER_BEFORE - 在重新排序(reorder)触发器之前
TablesRenderHook::TOOLBAR_SEARCH_AFTER - 在搜索容器之后
TablesRenderHook::TOOLBAR_SEARCH_BEFORE - 在搜索容器之前
TablesRenderHook::TOOLBAR_START - 工具栏起始位置
TablesRenderHook::TOOLBAR_COLUMN_MANAGER_TRIGGER_AFTER - 在列管理器触发器之后
TablesRenderHook::TOOLBAR_COLUMN_MANAGER_TRIGGER_BEFORE - 在列管理器触发器之前

Actions render hooks

All these render hooks can be scoped to any Livewire component class. When using the Panel Builder, these classes might be the List or Manage page of a resource, or a relation manager.

Scoping is typically not enough in this case, as Livewire components can have multiple actions, so you can access the action data as Filament\Actions\Action to identify the specific action in all these render hooks.

use Filament\Actions\View\ActionsRenderHook;

ActionsRenderHook::MODAL_CUSTOM_CONTENT_AFTER - After the modal content
ActionsRenderHook::MODAL_CUSTOM_CONTENT_BEFORE - Before the modal content
ActionsRenderHook::MODAL_CUSTOM_CONTENT_FOOTER_AFTER - After the modal content footer
ActionsRenderHook::MODAL_CUSTOM_CONTENT_FOOTER_BEFORE - Before the modal content footer
ActionsRenderHook::MODAL_SCHEMA_AFTER - After the modal schema
ActionsRenderHook::MODAL_SCHEMA_BEFORE - Before the modal schema

use Filament\Widgets\View\WidgetsRenderHook;

WidgetsRenderHook::TABLE_WIDGET_END - 在表格 Widget的末尾，在表格本身之后，还可以将其作用域限定到表格 Widget 类
WidgetsRenderHook::TABLE_WIDGET_START - 在表格 Widget的开头，在表格本身之前，还可以将其作用域限定到表格 Widget 类

渲染钩子作用域

有些渲染钩子可以限定“作用域”，这使得他们只在特定页面或者特定 Livewire 组件中输出。比如，你只想为一个页面注册渲染钩子。你可以将页面类或者组件类作为第二个参数传递给 registerRenderHook()：

use Filament\Support\Facades\FilamentView;
use Filament\View\PanelsRenderHook;
use Illuminate\Support\Facades\Blade;

FilamentView::registerRenderHook(
    PanelsRenderHook::PAGE_START,
    fn (): View => view('warning-banner'),
    scopes: \App\Filament\Resources\Users\Pages\EditUser::class,
);

你也可以传递一个作用域数组来注册渲染钩子：

use Filament\Support\Facades\FilamentView;
use Filament\View\PanelsRenderHook;

FilamentView::registerRenderHook(
    PanelsRenderHook::PAGE_START,
    fn (): View => view('warning-banner'),
    scopes: [
        \App\Filament\Resources\Users\Pages\CreateUser::class,
        \App\Filament\Resources\Users\Pages\EditUser::class,
    ],
);

有一些面板构建器的渲染钩子允许你将钩子作用域用于资源中的所有页面：

use Filament\Support\Facades\FilamentView;
use Filament\View\PanelsRenderHook;

FilamentView::registerRenderHook(
    PanelsRenderHook::PAGE_START,
    fn (): View => view('warning-banner'),
    scopes: \App\Filament\Resources\Users\UserResource::class,
);

在渲染钩子中检索当前激活作用域

$scopes 参数传入到渲染钩子参数，你可以用来确定那些页面或者组件中渲染这些钩子：

use Filament\Support\Facades\FilamentView;
use Filament\View\PanelsRenderHook;

FilamentView::registerRenderHook(
    PanelsRenderHook::PAGE_START,
    fn (array $scopes): View => view('warning-banner', ['scopes' => $scopes]),
    scopes: \App\Filament\Resources\Users\UserResource::class,
);

Passing data to render hooks

Render hooks can receive “data” from when the hook is rendered. To access data from a render hook, you can inject it using an array $data parameter to the hook’s rendering function:

use Filament\Support\Facades\FilamentView;
use Filament\Tables\View\TablesRenderHook;

FilamentView::registerRenderHook(
    TablesRenderHook::FILTER_INDICATORS,
    fn (array $data): View => view('filter-indicators', ['indicators' => $data['filterIndicators']]),
);

渲染钩子

插件开发者可能会想暴露渲染钩子给用户。你无需再任何地方对这些钩子进行注册，只需在 Blade 视图中像这样简单输出：

{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::PAGE_START) }}

要为你的渲染钩子提供作用域，你可以将其作为第二个参数传入到 renderHook() 中。比如，如果你的钩子在 Livewire 组件内，你可以使用 static::class 传递组件类：

{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::PAGE_START, scopes: $this->getRenderHookScopes()) }}

你可以将多个作用域作为数组传入，所有匹配该作用域的钩子都会被渲染：

{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::PAGE_START, scopes: [static::class, \App\Filament\Resources\Users\UserResource::class]) }}

You can pass data to a render hook using a data argument to the renderHook() function:

{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\Tables\View\TablesRenderHook::FILTER_INDICATORS, data: ['filterIndicators' => $filterIndicators]) }}

Edit on GitHub

Still need help? Join our Discord community or open a GitHub discussion

#简介

#注册渲染钩子

#可用渲染钩子

#面板构造器渲染钩子

#表格构造器渲染钩子

#Actions render hooks

#Widget 渲染钩子

#渲染钩子作用域

#在渲染钩子中检索当前激活作用域

#Passing data to render hooks

#渲染钩子

简介