Livewire通过使用yield和sections来拆分布局中的组件


class Authenticate extends Component
{
public string $email = 'sadsadsasad';
public string $firstName = '';
public string $lastName = '';
public string $password = '';
public string $passwordConfirmation = '';
/**
* @return User
*/
public function register(): User
{
dd('here');
$data = $this->validate([
'email' => 'required'
]);

return new User();
}
public function mount()
{
$this->email = 'sadsadsasad';
}
public function render()
{
return view('livewire.authenticate')
->extends('layouts.app')
->section('content');
}
}
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
@livewireStyles
</head>
<body>
<div>
@yield('content')
</div>

@livewireScripts
</body>
</html>
@extends('layouts.app') // I've tried with or without it
@section('content')
<form name="register-form" wire:submit.prevent="register" method="post" class="authenticate-form">
@csrf
<div class="form-row">
<div class="form-group col-md-6">
<input wire:model="first_name" type="text" id="first-name" name="first_name" placeholder="First Name *">
</div>
<div class="form-group col-md-6">
<input type="text" name="last_name" placeholder="Last Name *">
</div>
</div>
<div class="form-group">
<input type="email" wire:model="email" id="email" name="email" placeholder="Email *">
@error('email') <span>{{ $message }}</span> @enderror
</div>
<div class="form-group">
<input type="password" name="password" placeholder="Password">
</div>
<div class="form-group">
<input type="password" name="password_repeated" placeholder="Repeat Password">
</div>
<div class="pricing-btn pt-30">
<button type="submit" class="btn">Register</button>
</div>
</form>

@endsection

我已经尝试了一切使它与Laravel模板继承工作。什么都不起作用。我不知道发生了什么,如果我包含组件与@livewire('authenticate')它工作得很好。但是当我尝试使用yield, extension和section时它拒绝工作但是它呈现。

https://laravel-livewire.com/docs/2.x/rendering-components#custom-layout -我已经尝试了所有的文档

你可以在整页组件中使用分段:

// in livewire component class:
public function render()
{
return view('livewire.home') // Render livewire component
->extends('layouts.app') // Extends layout blade file
->section('content'); // Render component in @yield('content') area
}

文档链接:https://laravel-livewire.com/docs/2.x/rendering-components#page-components

最新更新