主页 / user-15639189

Alex T.'s questions

Martin Hope
Alex T.
Asked: 2025-03-29 09:12:40 +0800 CST
  • 5

我可以在 Livewire 组件上创建 Filamentphp 表单，以将其显示在公共页面上。但是它没有使用 Filament 样式。这是我的 Livewire 组件

<?php

namespace App\Livewire;
use Filament\Forms\Components\Wizard;
use Filament\Forms\Components\Select;
use Filament\Forms\Components\TextInput;
use Filament\Forms\Concerns\InteractsWithForms;
use Filament\Forms\Contracts\HasForms;
use Filament\Forms\Form;
use Livewire\Component;

class Submission extends Component implements HasForms
{
    use InteractsWithForms;
    public ?array $data = [];

    public function mount()
    {
        $this->form->fill();
    }

    public function form(Form $form): Form
    {
        return $form
            ->schema([
                Wizard::make([
                    Wizard\Step::make('Wizard Step 1')
                        ->schema([
                            Select::make('type')
                                ->label('Do you want:')
                                ->options([
                                    'a' => 'A',
                                    'b' => 'B',
                                    'not_sure' => 'Not Sure',
                                ]),
                        ]),

                    Wizard\Step::make('Wizard Step 2')
                        ->schema([
                            TextInput::make('names'),
                        ]),

                ])
            ]);
    }
    public function render()
    {
        return view('livewire.submission');
    }
}

这是我的组件视图

<div class="flex justify-center items-center min-h-screen">
    <form wire:submit.prevent="submit" class="w-full max-w-md bg-white p-6 rounded shadow">
        <div>
            {{ $this->form }}
        </div>
    </form>
</div>

这是我的页面浏览量

<x-app-layout>
    @livewire('submission')
</x-app-layout>

这是我的布局

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>{{ config('app.name', 'Laravel') }}</title>

    <!-- Filament Styles -->
    @vite(['resources/css/app.css', 'resources/js/app.js'])
    @livewireStyles
    @filamentStyles
</head>
<body class="antialiased bg-gray-100">
    <div class="min-h-screen">
        <!-- Replace this -->
        {{ $slot }}
        <!-- End replacement -->
    </div>

    @livewireScripts
    @filamentScripts
</body>
</html>

以下是我的结果： 在此处输入图片描述

您可以看到按钮是白色的，下拉菜单有一些时髦的样式。有没有办法应用与 fibre 内部相同的主题，同时仍让页面公开而没有所有菜单？就像登录或注册页面一样。

laravel