Filament Infolists 文本條目TextEntry完全指南顯示、格式化與交互定制【免費(fèi)下載鏈接】filamentA powerful open-source UI framework for Laravel ? Build and ship apps admin panels fast with Livewire項(xiàng)目地址: https://gitcode.com/GitHub_Trending/fi/filamentTextEntry 是 Filament Infolists 包中最基礎(chǔ)也最常用的只讀展示組件用于在詳情頁、關(guān)系管理器與動(dòng)作彈窗中顯示單條或多條文本數(shù)據(jù)。本文以 Filament 4.x 的packages/infolists/docs/02-text-entry.md為骨架結(jié)合 TextEntry.php 及 CanFormatState.php 等源碼實(shí)現(xiàn)系統(tǒng)講解文本條目的顏色、圖標(biāo)、徽章、日期/數(shù)字/金額格式化、Markdown/HTML 渲染、多值列表、長文本處理、剪貼板復(fù)制與前綴后綴動(dòng)作等全部能力幫助你在構(gòu)建 Laravel 后臺(tái)詳情頁時(shí)精準(zhǔn)掌控文本展示的每一個(gè)細(xì)節(jié)?；居梅ㄎ谋緱l目通過靜態(tài)方法make()創(chuàng)建其唯一參數(shù)是條目的名字通常對(duì)應(yīng) Eloquent 模型上的某個(gè)屬性。把它放進(jìn) Infolist 的 schema 組件數(shù)組中即可use Filament\Infolists\Components\TextEntry; TextEntry::make(title)條目名字支持點(diǎn)表示法dot notation可以跨關(guān)聯(lián)關(guān)系讀取屬性也可以讀取 JSON / 數(shù)組列中的鍵值TextEntry::make(author.name) // 讀取 author 關(guān)系上的 name 屬性 TextEntry::make(meta.title) // 讀取 meta JSON 列中的 title 鍵關(guān)于狀態(tài)state的概念、state()手動(dòng)傳值、default()默認(rèn)值、placeholder()空值占位、label()標(biāo)簽自定義等 Infolist 通用能力可參見 Infolists 總覽。文本條目的所有展示邏輯都建立在狀態(tài)之上。從源碼看TextEntry繼承了 Entry.php 并混入了多個(gè) ConcernCanFormatState格式化、HasColor顏色、HasIcon/HasIconColor圖標(biāo)、HasAffixes前后綴、CanBeCopied復(fù)制、CanWrap換行、HasFontFamily/HasWeight/HasLineClamp字體與行數(shù)控制這也是它能力如此豐富的原因所在。自定義文本顏色使用color()方法可以為文本設(shè)置顏色顏色可以是primary、success、warning、danger、gray等主題色也可以傳入任意 CSS 顏色use Filament\Infolists\Components\TextEntry; TextEntry::make(status) -color(primary)color()同樣接受閉包讓你可以根據(jù)狀態(tài)動(dòng)態(tài)計(jì)算顏色典型的用法是與下面的徽章模式配合讓狀態(tài)值擁有匹配的語義色詳見后文以徽章形式顯示一節(jié)。從 HasColor.php 的實(shí)現(xiàn)看getColor()在求值閉包后如果顏色仍為空且狀態(tài)對(duì)象實(shí)現(xiàn)了HasColor接口還會(huì)回退調(diào)用$state-getColor()——也就是說如果你的模型枚舉實(shí)現(xiàn)了該接口條目會(huì)自動(dòng)繼承其顏色定義。添加圖標(biāo)文本條目可以附帶一個(gè)圖標(biāo)use Filament\Infolists\Components\TextEntry; use Filament\Support\Icons\Heroicon; TextEntry::make(email) -icon(Heroicon::Envelope)icon()也接受閉包動(dòng)態(tài)計(jì)算圖標(biāo)。圖標(biāo)默認(rèn)顯示在文本之前可以通過iconPosition()調(diào)整位置use Filament\Infolists\Components\TextEntry; use Filament\Support\Enums\IconPosition; use Filament\Support\Icons\Heroicon; TextEntry::make(email) -icon(Heroicon::Envelope) -iconPosition(IconPosition::After) // IconPosition::Before默認(rèn)或 IconPosition::After圖標(biāo)顏色默認(rèn)繼承文本顏色如需單獨(dú)定制可使用iconColor()use Filament\Infolists\Components\TextEntry; use Filament\Support\Icons\Heroicon; TextEntry::make(email) -icon(Heroicon::Envelope) -iconColor(primary)從 TextEntry.php 的渲染邏輯toEmbeddedHtml()可以看到圖標(biāo)最終通過generate_icon_html()生成并且圖標(biāo)尺寸會(huì)跟隨文本尺寸聯(lián)動(dòng)TextSize::Medium對(duì)應(yīng)中等圖標(biāo)、TextSize::Large對(duì)應(yīng)大圖標(biāo)其余情況使用小圖標(biāo)。以徽章Badge形式顯示默認(rèn)的純文本沒有背景色。通過badge()可以把文本渲染成帶背景色的徽章最常見的應(yīng)用場景是狀態(tài)展示——配合color()讓不同狀態(tài)擁有語義色use Filament\Infolists\Components\TextEntry; TextEntry::make(status) -badge() -color(fn (string $state): string match ($state) { draft gray, reviewing warning, published success, rejected danger, })徽章上還可以疊加圖標(biāo)見上文添加圖標(biāo)一節(jié)。badge()也可接收布爾值或返回布爾值的閉包來動(dòng)態(tài)控制是否啟用徽章樣式TextEntry::make(status) -badge(FeatureFlag::active())在源碼中徽章由$isBadge屬性驅(qū)動(dòng)TextEntry.php渲染時(shí)會(huì)給條目加上fi-in-text-has-badges樣式類并使用BadgeComponent組件著色。格式化顯示內(nèi)容文本條目從模型自動(dòng)取到的原始值state未必適合直接展示。formatStateUsing()可以在不改動(dòng)原始數(shù)據(jù)的前提下把狀態(tài)格式化成更友好的文本——這在多語言應(yīng)用中非常實(shí)用use Filament\Infolists\Components\TextEntry; TextEntry::make(status) -formatStateUsing(fn (string $state): string __(statuses.{$state}))例如數(shù)據(jù)庫中的status列存放draft、reviewing、published、rejected等值界面展示的則是翻譯后的文本。formatStateUsing()的函數(shù)同樣支持注入各種工具參數(shù)見文末工具注入。除了手寫閉包Filament 還內(nèi)置了一系列一鍵格式化方法。它們的底層統(tǒng)一實(shí)現(xiàn)在 CanFormatState.php 的formatState()方法中該方法先求值formatStateUsing閉包再依次處理數(shù)組序列化、HTML/富文本、字符數(shù)與單詞數(shù)截?cái)?、前后綴拼接等環(huán)節(jié)。日期格式化使用date()、dateTime()、time()方法可以直接基于 PHP 日期格式化令牌 格式化狀態(tài)use Filament\Infolists\Components\TextEntry; TextEntry::make(created_at)-date() TextEntry::make(created_at)-dateTime() TextEntry::make(created_at)-time()三個(gè)方法都接受自定義格式字符串TextEntry::make(created_at)-date(M j, Y) TextEntry::make(created_at)-dateTime(M j, Y H:i:s) TextEntry::make(created_at)-time(H:i:s)格式化字符串同樣可以傳入閉包動(dòng)態(tài)計(jì)算。從 CanFormatState.php 的date()實(shí)現(xiàn)看其內(nèi)部是Carbon::parse($state)-setTimezone(...)-translatedFormat($format)并使用容器的默認(rèn)日期顯示格式作為兜底。使用 Carbon 宏格式isoDate()、isoDateTime()、isoTime()方法則使用 Carbon 的宏格式如L、LLL、LTuse Filament\Infolists\Components\TextEntry; TextEntry::make(created_at)-isoDate() TextEntry::make(created_at)-isoDateTime() TextEntry::make(created_at)-isoTime() // 傳入自定義宏格式字符串 TextEntry::make(created_at)-isoDate(L) TextEntry::make(created_at)-isoDateTime(LLL) TextEntry::make(created_at)-isoTime(LT)相對(duì)時(shí)間格式化since()方法基于 Carbon 的diffForHumans()把時(shí)間渲染為相對(duì)時(shí)間如3 分鐘前use Filament\Infolists\Components\TextEntry; TextEntry::make(created_at) -since()在懸浮提示Tooltip中顯示格式化日期下面這些方法可以把格式化后的日期放進(jìn)懸浮提示里常與since()這類信息壓縮型展示搭配為用戶補(bǔ)充精確時(shí)間use Filament\Infolists\Components\TextEntry; TextEntry::make(created_at) -since() -dateTooltip() // 接受自定義 PHP 日期格式字符串 TextEntry::make(created_at) -since() -dateTimeTooltip() // 接受自定義 PHP 日期格式字符串 TextEntry::make(created_at) -since() -timeTooltip() // 接受自定義 PHP 日期格式字符串 TextEntry::make(created_at) -since() -isoDateTooltip() // 接受自定義 Carbon 宏格式字符串 TextEntry::make(created_at) -since() -isoDateTimeTooltip() // 接受自定義 Carbon 宏格式字符串 TextEntry::make(created_at) -since() -isoTimeTooltip() // 接受自定義 Carbon 宏格式字符串 TextEntry::make(created_at) -dateTime() -sinceTooltip()源碼中這些*Tooltip()方法本質(zhì)上都是調(diào)用tooltip()方法并傳入一個(gè)格式化閉包CanFormatState.php。設(shè)置日期格式化時(shí)區(qū)所有日期格式化方法都接受timezone參數(shù)用于把狀態(tài)中的時(shí)間轉(zhuǎn)換到目標(biāo)時(shí)區(qū)use Filament\Infolists\Components\TextEntry; TextEntry::make(created_at) -dateTime(timezone: America/New_York)也可以使用timezone()方法一次性為條目上的所有日期時(shí)間格式化方法設(shè)置時(shí)區(qū)TextEntry::make(created_at) -timezone(America/New_York) -dateTime()如果條目沒有單獨(dú)指定時(shí)區(qū)則使用 Filament 的默認(rèn)時(shí)區(qū)?？梢栽诜?wù)提供者如AppServiceProvider的boot()方法中通過FilamentTimezone::set()全局設(shè)置默認(rèn)時(shí)區(qū)use Filament\Support\Facades\FilamentTimezone; public function boot(): void { FilamentTimezone::set(America/New_York); }這在需要為應(yīng)用中所有文本條目統(tǒng)一默認(rèn)時(shí)區(qū)時(shí)非常有用Filament 中其他涉及時(shí)區(qū)的場景也復(fù)用該設(shè)置。注意Filament 的默認(rèn)時(shí)區(qū)只在條目存儲(chǔ)了時(shí)間時(shí)才生效。如果條目只存儲(chǔ)日期使用date()而非dateTime()時(shí)區(qū)不會(huì)應(yīng)用——這是為了避免存儲(chǔ)無時(shí)間日期時(shí)發(fā)生時(shí)區(qū)偏移CanFormatState.php 中g(shù)etTimezone()也印證了這一點(diǎn)僅當(dāng)isDateTime()為真時(shí)才使用FilamentTimezone::get()否則回退到config(app.timezone)。數(shù)字格式化numeric()方法把條目渲染為按本地化規(guī)則格式化的數(shù)字use Filament\Infolists\Components\TextEntry; TextEntry::make(stock) -numeric()可通過decimalPlaces參數(shù)指定小數(shù)位TextEntry::make(stock) -numeric(decimalPlaces: 0)默認(rèn)使用應(yīng)用 locale 進(jìn)行數(shù)字格式化也可通過locale參數(shù)指定TextEntry::make(stock) -numeric(locale: nl)decimalPlaces與locale均支持閉包動(dòng)態(tài)計(jì)算。從源碼看numeric()在未顯式指定分隔符時(shí)走Number::format()的本地化路徑若傳入自定義decimalSeparator/thousandsSeparator如ArgumentValue::Default之外的值則改用 PHP 的number_format()CanFormatState.php。金額格式化money()方法可以按任意貨幣格式化金額use Filament\Infolists\Components\TextEntry; TextEntry::make(price) -money(EUR)divideBy參數(shù)允許在格式化前先除以一個(gè)數(shù)——例如數(shù)據(jù)庫以分存儲(chǔ)價(jià)格時(shí)非常實(shí)用TextEntry::make(price) -money(EUR, divideBy: 100)同樣支持locale與decimalPlaces參數(shù)TextEntry::make(price) -money(EUR, locale: nl) TextEntry::make(price) -money(EUR, decimalPlaces: 3)money()的底層通過Number::currency($state, $currency, $locale, $decimalPlaces)實(shí)現(xiàn)貨幣與 locale 缺省時(shí)分別回退到容器默認(rèn)貨幣與應(yīng)用 localeCanFormatState.php。所有參數(shù)同樣支持閉包。渲染 Markdown如果條目值是 Markdown 文本可以使用markdown()渲染use Filament\Infolists\Components\TextEntry; TextEntry::make(description) -markdown()同樣支持布爾參數(shù)或閉包動(dòng)態(tài)開關(guān)TextEntry::make(description) -markdown(FeatureFlag::active())渲染 HTML如果條目值是 HTML可以使用html()渲染use Filament\Infolists\Components\TextEntry; TextEntry::make(description) -html()同樣支持布爾參數(shù)或閉包TextEntry::make(description) -html(FeatureFlag::active())安全提示Filament 內(nèi)置的 HTML 清理器為了支持富文本格式如字體顏色、文本高亮、圖片尺寸允許內(nèi)聯(lián)style屬性。這意味著background: url(...)或position: fixed這類 CSS 屬性不會(huì)被從清理后的 HTML 中剔除。如果內(nèi)容來自不受信任的用戶應(yīng)考慮收緊默認(rèn)配置具體見 安全文檔即 高級(jí)·安全。源碼中html()與markdown()的注釋也明確記錄了這一點(diǎn)CanFormatState.php兩者最終都會(huì)走Str::sanitizeHtml()。渲染未經(jīng)清理的原始 HTML如果你確實(shí)需要跳過清理可以把 HTML 包裝成HtmlString對(duì)象返回use Filament\Infolists\Components\TextEntry; use Illuminate\Support\HtmlString; TextEntry::make(description) -formatStateUsing(fn (string $state): HtmlString new HtmlString($state))危險(xiǎn)渲染原始 HTML 可能包含惡意內(nèi)容導(dǎo)致 XSS 等安全漏洞。使用前務(wù)必確保渲染的 HTML 是安全的。另一種繞過清理的方式是從formatStateUsing()中返回view()對(duì)象視圖渲染結(jié)果同樣不會(huì)被清理use Filament\Infolists\Components\TextEntry; use Illuminate\Contracts\View\View; TextEntry::make(description) -formatStateUsing(fn (string $state): View view( filament.infolists.components.description-entry-content, [state $state], ))展示多個(gè)值當(dāng)條目狀態(tài)是數(shù)組時(shí)例如 Eloquent 屬性使用了arraycast、關(guān)聯(lián)關(guān)系返回多條結(jié)果或通過state()傳入了數(shù)組文本條目會(huì)以逗號(hào)分隔渲染多個(gè)值。使用listWithLineBreaks()可以讓每個(gè)值獨(dú)占一行use Filament\Infolists\Components\TextEntry; TextEntry::make(authors.name) -listWithLineBreaks()同樣支持布爾/閉包參數(shù)TextEntry::make(authors.name) -listWithLineBreaks(FeatureFlag::active())從 TextEntryTest.php 的測試可以看到多個(gè)值Tag 1、Tag 2、Tag 3都能被正確渲染而isListWithLineBreaks()在設(shè)置了bulleted()時(shí)也會(huì)返回true。為列表添加項(xiàng)目符號(hào)bulleted()方法為每個(gè)列表項(xiàng)添加項(xiàng)目符號(hào)TextEntry::make(authors.name) -bulleted()同樣支持布爾/閉包參數(shù)TextEntry::make(authors.name) -bulleted(FeatureFlag::active())限制列表項(xiàng)數(shù)量limitList()可以限制最多顯示的列表項(xiàng)個(gè)數(shù)TextEntry::make(authors.name) -listWithLineBreaks() -limitList(3)展開被限制的列表expandableLimitedList()允許用戶展開/收起被截?cái)嗟牧斜鞹extEntry::make(authors.name) -listWithLineBreaks() -limitList(3) -expandableLimitedList()該功能僅對(duì)listWithLineBreaks()或bulleted()生效因?yàn)檫@兩種模式下每個(gè)條目獨(dú)占一行。同樣支持布爾/閉包參數(shù)TextEntry::make(authors.name) -listWithLineBreaks() -limitList(3) -expandableLimitedList(FeatureFlag::active())源碼層面限制列表的邏輯在 TextEntry.php先計(jì)算超出數(shù)量的條目數(shù)若不可展開則直接用array_slice()截?cái)嗫烧归_時(shí)則保留全部數(shù)據(jù)通過 Alpine.js 的x-show/isLimited狀態(tài)控制顯隱并渲染展開/收起鏈接使用trans_choice()處理單復(fù)數(shù)文案。把單個(gè)值按分隔符拆分成多個(gè)列表項(xiàng)separator()方法可以把模型中的一段文本按分隔符拆分成多個(gè)列表項(xiàng)——例如把逗號(hào)分隔的標(biāo)簽渲染成徽章use Filament\Infolists\Components\TextEntry; TextEntry::make(tags) -badge() -separator(,)聚合關(guān)聯(lián)關(guān)系Filament 為文本條目提供了關(guān)系聚合方法avg()、max()、min()、sum()。例如想展示某個(gè)關(guān)聯(lián)下所有記錄某字段的平均值use Filament\Infolists\Components\TextEntry; TextEntry::make(users_avg_age)-avg(users, age)這里users是關(guān)聯(lián)名age是被聚合的字段。條目名必須寫成users_avg_age這種約定格式——這正是 Laravel 聚合函數(shù) 存儲(chǔ)結(jié)果的命名規(guī)范。從源碼看avg()內(nèi)部通過$record-loadAvg($relationship, $column)加載聚合值再讀取條目名對(duì)應(yīng)的屬性TextEntry.phpcounts()、max()、min()、sum()分別對(duì)應(yīng)loadCount()/loadMax()/loadMin()/loadSum()。如果需要在聚合前對(duì)關(guān)聯(lián)查詢做約束可以傳入數(shù)組鍵為關(guān)聯(lián)名、值為作用域閉包use Filament\Infolists\Components\TextEntry; use Illuminate\Database\Eloquent\Builder; TextEntry::make(users_avg_age)-avg([ users fn (Builder $query) $query-where(is_active, true), ], age)自定義文本大小文本條目默認(rèn)使用小號(hào)字體可通過size()切換為TextSize::ExtraSmall、TextSize::Medium或TextSize::Largeuse Filament\Infolists\Components\TextEntry; use Filament\Support\Enums\TextSize; TextEntry::make(title) -size(TextSize::Large)從 TextSize.php 可以看到枚舉值ExtraSmall xs、Small sm默認(rèn)、Medium md、Large lgTextEntry.php 的getSize()會(huì)先把閉包求值空值回退到TextSize::Small字符串base則映射為TextSize::Medium。自定義字體粗細(xì)默認(rèn)字重為常規(guī)regular可通過weight()切換為以下選項(xiàng)FontWeight::Thin、FontWeight::ExtraLight、FontWeight::Light、FontWeight::Medium、FontWeight::SemiBold、FontWeight::Bold、FontWeight::ExtraBold、FontWeight::Black。例如加粗use Filament\Infolists\Components\TextEntry; use Filament\Support\Enums\FontWeight; TextEntry::make(title) -weight(FontWeight::Bold)weight()也接受閉包動(dòng)態(tài)計(jì)算。自定義字體族fontFamily()可以切換字體族選項(xiàng)包括FontFamily::Sans、FontFamily::Serif、FontFamily::Mono。例如把 API 密鑰渲染為等寬字體use Filament\Support\Enums\FontFamily; use Filament\Infolists\Components\TextEntry; TextEntry::make(apiKey) -label(API key) -fontFamily(FontFamily::Mono)同樣接受閉包動(dòng)態(tài)計(jì)算。處理長文本限制文本長度limit()可以限制條目值的字符數(shù)use Filament\Infolists\Components\TextEntry; TextEntry::make(description) -limit(50)默認(rèn)截?cái)嗪笞芳邮÷蕴?hào)...可通過end參數(shù)自定義TextEntry::make(description) -limit(50, end: (more))limit()和end都支持閉包。你還可以在閉包里通過getCharacterLimit()復(fù)用傳入limit()的值——例如結(jié)合tooltip()實(shí)現(xiàn)內(nèi)容超長時(shí)才顯示完整文本懸浮提示use Filament\Infolists\Components\TextEntry; TextEntry::make(description) -limit(50) -tooltip(function (TextEntry $component): ?string { $state $component-getState(); if (strlen($state) $component-getCharacterLimit()) { return null; } // 僅當(dāng)條目內(nèi)容超過長度限制時(shí)才渲染懸浮提示 return $state; })限制單詞數(shù)words()可以限制顯示的單詞數(shù)量TextEntry::make(description) -words(10)同樣支持end參數(shù)自定義截?cái)嗪缶YTextEntry::make(description) -words(10, end: (more))從 CanFormatState.php 看limit()與words()分別存儲(chǔ)字符限制和單詞限制最終在formatState()中通過Str::limit()與Str::words()執(zhí)行截?cái)?。限制文本行?shù)lineClamp()把文本限制為固定行數(shù)超出的部分被裁剪。這在響應(yīng)式界面中特別有用可以保證不同屏幕尺寸下體驗(yàn)一致TextEntry::make(description) -lineClamp(2)渲染時(shí)行數(shù)通過 CSS 自定義屬性--line-clamp注入TextEntry.php。禁止文本換行默認(rèn)文本超出容器寬度時(shí)會(huì)換行wrap(false)可以禁止換行TextEntry::make(description) -wrap(false)TextEntry的默認(rèn)行為是允許換行的源碼中canWrapByDefault()返回true見 TextEntry.php。允許一鍵復(fù)制到剪貼板copyable()讓文本可點(diǎn)擊復(fù)制到剪貼板并可自定義確認(rèn)消息與顯示時(shí)長毫秒use Filament\Infolists\Components\TextEntry; TextEntry::make(apiKey) -label(API key) -copyable() -copyMessage(Copied!) -copyMessageDuration(1500)同樣支持布爾/閉包參數(shù)動(dòng)態(tài)控制TextEntry::make(apiKey) -label(API key) -copyable(FeatureFlag::active())copyable()、copyMessage()、copyMessageDuration()均支持閉包。底層通過CanBeCopiedconcern 實(shí)現(xiàn)渲染時(shí)使用window.navigator.clipboard.writeText()寫入剪貼板并用$tooltip()彈出確認(rèn)消息TextEntry.php。注意該功能僅在應(yīng)用啟用 SSL 時(shí)可用瀏覽器對(duì)剪貼板 API 的安全上下文要求。添加前綴與后綴動(dòng)作可以使用prefixAction()和suffixAction()在條目前后放置動(dòng)作按鈕與prefix()/suffix()純文本前后綴配合使用。例如給價(jià)格條目加一個(gè)復(fù)制到 Price的動(dòng)作use Filament\Actions\Action; use Filament\Infolists\Components\TextEntry; use Filament\Support\Icons\Heroicon; TextEntry::make(cost) -prefix(€) -suffixAction( Action::make(copyCostToPrice) -icon(Heroicon::Clipboard), )從 HasAffixes.php 的實(shí)現(xiàn)看前后綴動(dòng)作支持傳入單個(gè)動(dòng)作或動(dòng)作數(shù)組且最終都會(huì)被強(qiáng)制應(yīng)用Size::Small與Action::ICON_BUTTON_VIEW即渲染為小號(hào)圖標(biāo)按鈕。prefix()與suffix()純文本在 CanFormatState.php 的formatState()末尾統(tǒng)一拼接到狀態(tài)兩側(cè)。更多工具注入與全局配置與 Infolist 其他條目一致TextEntry 的絕大多數(shù)配置方法都接受閉包并能通過參數(shù)注入多種工具$state、$record、$component、$livewire、$get、$operation等詳見 Infolists 總覽 的Entry utility injection一節(jié)。此外可以通過configureUsing()在服務(wù)提供者的boot()方法中全局修改所有TextEntry的默認(rèn)行為例如讓所有文本條目默認(rèn)words(10)再在單個(gè)條目上用words(null)覆蓋。相關(guān)閱讀Infolists 總覽與條目通用能力圖標(biāo)條目 IconEntry顏色樣式系統(tǒng)圖標(biāo)使用指南安全與 HTML 清理器定制核心實(shí)現(xiàn)TextEntry.php、CanFormatState.php測試驗(yàn)證TextEntryTest.php【免費(fèi)下載鏈接】filamentA powerful open-source UI framework for Laravel ? Build and ship apps admin panels fast with Livewire項(xiàng)目地址: https://gitcode.com/GitHub_Trending/fi/filament創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考