title: Cannot pass variable to Laravel x-component
body: <p>I am building a webpage in Laravel 8 using x-components in some places. A component is a modal present in all pages but whose content must change depending on the page invoking it.</p>
  <p>My idea was the following:</p>
  <ol>
  <li><strong>IndexController</strong> using <strong>PageModel</strong> passes <em>$pageid</em> to <strong>index.blade</strong> view</li>
  <li><strong>index.blade</strong> passes <em>$pageid</em> to <strong>x-insert-section</strong> component</li>
  <li><strong>x-insert-section</strong> component uses it in a @switch directive to show the required content per page</li>
  </ol>
  <p>The problem is that <strong>x-insert-section</strong> doesn't seem to receive any value in <em>$pageid</em>.</p>
  <p>The code is the following:</p>
  <p><strong>My IndexController.php</strong></p>
  <pre><code>
  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', '/')-&gt;first();
  
          return view('index', [
              'page' =&gt; $page,
              'entries' =&gt; Entry::where('page', $page-&gt;id)-&gt;get(),
              'pageid' =&gt; $page-&gt;id
          ]);
      }
  }
  
  </code></pre>
  <p><strong>The part of index.blade.php where the x-components are loaded</strong></p>
  <pre><code>    &lt;x-insert-section :pageid=&quot;$pageid&quot;&gt;&lt;/x-insert-section&gt;
      &lt;x-insert-jumbo-image :pageid=&quot;$pageid&quot;&gt;&lt;/x-insert-jumbo-image&gt;
  </code></pre>
  <p><strong>InsertSection.php Component</strong></p>
  <pre><code>&lt;?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');
      }
  }
  </code></pre>
  <p><strong>The view of the insert-section.blade.php (Switch contents have been replaced by comments to reduce code length)</strong></p>
  <pre><code>&lt;div class=&quot;modal fade&quot; id=&quot;create-modal&quot; tabindex=&quot;-1&quot; role=&quot;dialog&quot; aria-hidden=&quot;true&quot;&gt;
      &lt;div class=&quot;modal-dialog modal-dialog-centered&quot; role=&quot;document&quot;&gt;
          &lt;div class=&quot;modal-content&quot;&gt;
          &lt;div class=&quot;modal-header&quot;&gt;
              &lt;h5 class=&quot;modal-title&quot; id=&quot;modal-entry-title&quot;&gt;&lt;/h5&gt;
              &lt;button type=&quot;button&quot; class=&quot;close&quot; data-dismiss=&quot;modal&quot; aria-label=&quot;Close&quot;&gt;
              &lt;span aria-hidden=&quot;true&quot;&gt;&amp;times;&lt;/span&gt;
              &lt;/button&gt;
          &lt;/div&gt;
          &lt;div class=&quot;modal-body&quot;&gt;
  
          @switch($pageid)
              @case('1')
                        &lt;!-- Form type 1 --&gt;
                  @break
  
              @case('3')
                        &lt;!-- Form type 2 --&gt;
                  @break
  
              @default
                 Default Case
          @endswitch
  
          &lt;/div&gt;
          &lt;div class=&quot;modal-footer&quot;&gt;
              &lt;button id=&quot;confirm-entry&quot; type=&quot;submit&quot; form=&quot;create-form&quot; class=&quot;btn btn-primary&quot;&gt;{{$pageid}}&lt;/button&gt;
          &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p><strong>NOTE: I have tried using both '1' and 1 as values for the switch case, even sending harcoded strings, none worked</strong></p>
  <p>Finally, the result on screen when the modal is called. No form is loaded and the switch resolves to default case.</p>
  <p><a href="https://i.stack.imgur.com/uOlCF.png" rel="nofollow noreferrer">Screenshot of modal</a></p>
  <p>Any help would be greatly appreciated.</p>