使用整頁組件時如何更改頁面標題-Livewire

Question

<head>
   <title>dynamic title here - {{ config('app.name') }}</title>
</head>

如果你試試這個，請告訴我。

Answer 1

我更喜歡使用 JavaScript 和 Blade Components document.title = 'My Title'

用Alpine JS實現

刀片組件 (.../components/page-title.blade.php)

@props(['title'])

<div x-data x-init="document.title = @js($title.' - '.config('app.name'))"></div>

所以你可以像這樣在你的刀片中的任何地方調用page-title組件

<x-page-title :title="'Homepage'" />

可能有更簡單的方法可以用 JavaScript 的方式來做，但這是我能想到的。 希望能幫助到你

PHP 的方式可能是將$title作為道具傳遞給布局，例如

<x-guest-layout :page-title="$title">
... Page Content
</x-guest-layout>

guest-layout.blade.php現在看起來像

@props(['title'])
<html>
  <head>
      <title>{{ $title }}</title>
  </head>
  <body>
    {{ $slot }}
  </body>
</html>