无法将变量传递给 Laravel x 组件

Question

我正在 Laravel 8 中的某些地方使用 x 组件构建一个网页。组件是存在于所有页面中的模式，但其内容必须根据调用它的页面而改变。

我的想法如下：

1. IndexController使用PageModel将$pageid传递给index.blade视图
2. index.blade将$pageid传递给x-insert-section组件
3. x-insert-section组件在 @switch 指令中使用它来显示每页所需的内容

问题是x-insert-section似乎没有在$pageid中接收任何值。

代码如下：

我的 IndexController.php

namespace App\Http\Controllers;

use App\Http\Controllers\Controller;
use App\Models\Page;
use App\Models\Entry;
use Illuminate\Http\Request;

class IndexController extends Controller
{
    public function init(Request $request)
    {

        $page = Page::where('slug', '/')->first();

        return view('index', [
            'page' => $page,
            'entries' => Entry::where('page', $page->id)->get(),
            'pageid' => $page->id
        ]);
    }
}

index.blade.php 加载 x 组件的部分

    <x-insert-section :pageid="$pageid"></x-insert-section>
    <x-insert-jumbo-image :pageid="$pageid"></x-insert-jumbo-image>

InsertSection.php 组件

<?php

namespace App\View\Components;

use Illuminate\View\Component;

class InsertSection extends Component
{

    public function __construct(){}

    public $pageid;

    public function render()
    {
        return view('components.insert-section');
    }
}

insert-section.blade.php 的视图（开关内容已被注释替换以减少代码长度）

<div class="modal fade" id="create-modal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="modal-entry-title"></h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="modal-body">

        @switch($pageid)
            @case('1')
                      <!-- Form type 1 -->
                @break

            @case('3')
                      <!-- Form type 2 -->
                @break

            @default
               Default Case
        @endswitch

        </div>
        <div class="modal-footer">
            <button id="confirm-entry" type="submit" form="create-form" class="btn btn-primary">{{$pageid}}</button>
        </div>
        </div>
    </div>
</div>

注意：我尝试过使用“1”和 1 作为 switch case 的值，甚至发送编码字符串，但都不起作用

最后，调用模态时屏幕上的结果。未加载任何表单，并且开关解析为默认情况。

模态截图

任何帮助将不胜感激。

Answer 1

事实证明，我在阅读文档后找到了解决方案（祝福他们，该死的我糟糕的阅读）

缺少的部分是构造函数接收变量，因此代码会这样更改。

InsertSection.php 组件

从：

    public function __construct(){}

    public $pageid;

到：

    public $pageid;

    public function __construct($pageid)
    {
        $this->pageid = $pageid;
    }

我知道我知道，这很有道理，但我想下次我会记住它。