Laravel Filament 3 Auto Slug Generation afterStateUpdated、Str::slug()、live()、dump() 学習メモ

Filament Auto Slug Generation & afterStateUpdated、Str::slug()、live()、dump() について

参考）Laravel Filamentのインプット要素(Form Builder)

https://zenn.dev/shieworks/articles/63efe9a0d4082a

afterStateUpdated テキストを入力したら他のフィールドにも自動で入力

サンプル afterStateUpdated、dump

    public static function form(Form $form): Form
    {
        return $form
            ->schema([
                TextInput::make('title')
                    ->live()
                    ->required()->minLength(1)->maxLength(150)
                    ->afterStateUpdated(function () {
                        dump("hi");
                    }),

titleに入力したら、

live()、dump()でデバッグ表示

live()

呼び出すことで、対象のフィールドの入力をリアルタイムに受け取れる。

dump()

変数の内容をブラウザー上に表示する。

次にパラーメータ string $operation, $state, Forms\Set $set を追加。

    public static function form(Form $form): Form
    {
        return $form
            ->schema([
                TextInput::make('title')
                    ->required()->minLength(1)->maxLength(150)
                    ->live(onBlur:true)
                    ->afterStateUpdated(function (string $operation, $state, Forms\Set $set) {
                        dump($operation);
                        dump($state);

テスト２

    public static function form(Form $form): Form
    {
        return $form
            ->schema([
                TextInput::make('title')
                    ->required()->minLength(1)->maxLength(150)
                    ->live(onBlur:true)
                    ->afterStateUpdated(function (string $operation, $state, Forms\Set $set, Forms\Get $get,Category $category) {
                        dump($category);
                    }),
                TextInput::make('slug')->required()->minLength(1)->unique(ignoreRecord: true)->maxLength(150),
                TextInput::make('text_color')->nullable(),
                TextInput::make('bg_color')->nullable(),
            ]);
    }

CategoryResource.php（変更）

最終版

<?php

namespace App\Filament\Resources;

use App\Filament\Resources\CategoryResource\Pages;
use App\Filament\Resources\CategoryResource\RelationManagers;
use App\Models\Category;
use Filament\Forms;
use Filament\Forms\Components\TextInput;
use Filament\Forms\Form;
use Filament\Resources\Resource;
use Filament\Tables;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Table;
use Illuminate\Database\Eloquent\Builder;
use Illuminate\Database\Eloquent\SoftDeletingScope;
use Illuminate\Support\Str;

class CategoryResource extends Resource
{
    protected static ?string $model = Category::class;

    protected static ?string $navigationIcon = 'heroicon-o-rectangle-stack';

    // protected static bool $shouldSkipAuthorization = true;

    public static function form(Form $form): Form
    {
        return $form
            ->schema([
                TextInput::make('title')
                    ->required()->minLength(1)->maxLength(150)
                    ->live(onBlur:true)
                    ->afterStateUpdated(function (string $operation, $state, Forms\Set $set) {
                        if ($operation === 'edit') {
                            return;
                        }

                        $set('slug', Str::slug($state));
                    }),
                TextInput::make('slug')->required()->minLength(1)->unique(ignoreRecord: true)->maxLength(150),
                TextInput::make('text_color')->nullable(),
                TextInput::make('bg_color')->nullable(),
            ]);
    }

    public static function table(Table $table): Table
    {
        return $table
            ->columns([
                TextColumn::make('title')->sortable()->searchable(),
                TextColumn::make('slug')->sortable()->searchable(),
                TextColumn::make('text_color')->sortable()->searchable(),
                TextColumn::make('bg_color')->sortable()->searchable(),
            ])
            ->filters([
                //
            ])
            ->actions([
                Tables\Actions\EditAction::make(),
            ])
            ->bulkActions([
                Tables\Actions\BulkActionGroup::make([
                    Tables\Actions\DeleteBulkAction::make(),
                ]),
            ]);
    }

    public static function getRelations(): array
    {
        return [
            //
        ];
    }

    public static function getPages(): array
    {
        return [
            'index' => Pages\ListCategories::route('/'),
            'create' => Pages\CreateCategory::route('/create'),
            'edit' => Pages\EditCategory::route('/{record}/edit'),
        ];
    }
}

Str::slug()は、

与えられた文字列をURL用のスラッグ（読みやすく、URLに適した形式の文字列）に変換するメソッドです。スペースはハイフンに置き換えられ、特殊文字は削除されます。