带有Inertia的PHP枚举-Vue Js

Question

我想知道是否有一种巧妙的方法可以通过惯性中间件将php-enum传递到vue-js中。

基本上能够重用标签，vue中来自一个源和php(laravel(的值。

不确定是否有人想过这件事，但有兴趣听听。

感谢

Answer 1

您有没有为此想出解决方案？否则，您可以定义一个PHP 8.1 Enum，其中包含一个生成选择选项数组的方法，例如:

// appEnumsStatus.php
namespace AppEnums;
use AppEnumsConcernsHasOptions;
enum Status: int
{
use HasOptions;
case DRAFTED = 1;
case SUBMITTED = 2;
case APPROVED = 3;
public function displayName(): string
{
return match ($this) {
self::DRAFTED => 'drafted',
self::SUBMITTED => 'submitted',
self::APPROVED => 'approved'
};
}
}
// appEnumsConcernsHasOptions.php
namespace AppEnumsConcerns;
trait HasOptions
{
public static function options(): array
{
return collect(self::cases())
->map(function ($enum) {
return [
'name' => $enum->displayName(),
'value' => $enum->value,
];
})->toArray();
}
abstract public function displayName(): string;
}

在Inertia中间件中，您可以在share方法中传递此选择选项，例如：

// app/Http/Middleware/HandleInertiaRequests.php
namespace AppHttpMiddleware;
use IlluminateHttpRequest;
use InertiaMiddleware;
use TightencoZiggyZiggy;
use AppEnumsStatus;
class HandleInertiaRequests extends Middleware
{
...

public function share(Request $request): array
{
return array_merge(parent::share($request), [
...
statusOptions => Status::options(),
]);
}
}

并使用usePage组合检索选择数组，例如：

// resources/js/Pages/MyPage.vue
import { usePage } from @inertiajs/vue3;
const statusOptions = usePage().props.statusOptions;

或者，如果您只想将选择选项数组传递到特定页面，而不是全局页面，您可以将其作为道具传递，例如：

// app/Http/Controllers/MyPageController.php
namespace AppHttpControllers;
use AppEnumsStatus;
class MyPageController extends Controller 
{
public function index()
{
return Inertia::render('MyPage', [
'statusOptions' => Status::options()
]);
}
}
// resources/js/Pages/MyPage.vue
const { statusOptions } = defineProps(['statusOptions']);