laravel - 如何在 Laravel Livewire 的引导模式中显示帖子记录？

问题描述

我正在尝试构建一个有点移动应用程序感觉的网络应用程序（我仍然懒惰学习跨平台框架:)）。所以我有一个显示所有事件帖子的页面，我可以通过单击 a href 来查看每个帖子（我的路线完美无缺）。但我真正想要实现的是在 BOOTSTRAP MODAL 中显示每个发布事件。因此，如果我使用按钮并添加 wire:click 到按钮 (*button type="button" wire:click.prevent="show({{ $event->id }})">)，它应该会弹出模态和传递给它的数据。但不幸的是，它不起作用:(。模式将显示但数据未传递:'(

我的代码如下：

应用程序\Http\Livewire\Events.php

<?php

namespace App\Http\Livewire;

use Livewire\Component;
use App\Models\Event;

class Events extends Component
{
    public $events;
    public $event;
    public $event_id;
    public $event_title;
    public $event_author;
    public $event_date;
    public $event_time;
    public $event_image;
    public $event_location;
    public $event_map;
    public $event_details;

    public function show($id)
    {
        $this->event  = Event::where('id', $id)->first();

        $this->event_id         = $id;
        $this->event_title      = $event->event_title;
        $this->event_author     = $event->event_author;
        $this->event_date       = $event->event_date;
        $this->event_time       = $event->event_time;
        $this->event_image      = $event->event_image;
        $this->event_location   = $event->event_location;
        $this->event_map        = $event->event_map;
        $this->event_details    = $event->event_details;
    }

    public function render()
    {
        $this->events   = Event::orderBy('id', 'desc')->get();
        return view('livewire.events');
    }
}

资源\视图\livewire\events.blade.php

@section('title', 'Events')
@include('livewire.view-event')

<div class="block pt-1 pb-6">
    <div class="row m-0">
        @if (count($events) > 0)
            @foreach ($events as $event)
                <div class="col-12 mb-2">
                    <a type="button" data-toggle="modal" data-target="#showEventModal" wire:click="show({{ $event->id }})">
                        <div class="card bg-white shadow p-0">
                            <div class="card-header">
                                <div class="block mb-05">
                                    <img class="inline rounded mr-05" src="/assets/uploads/images/{{ $event->event_image }}" width="40" height="40">

                                    <span class="elegant font-md">{{ $event->event_title }}</span>
                                </div>

                                <div class="block elegant font-sm">
                                    <span class="block"><i class="fas fa-bullhorn mr-05"></i> {{ $event->event_author }}</span>

                                    <span><i class="fas fa-calendar-alt"></i> {{ $event->event_date }} <span class="mx-05">|</span> <i class="fas fa-clock"></i> {{ $event->event_time }}</span>
                                </div>
                            </div>

                            <div class="card-body p-0">
                                @if (!empty($event->event_image))
                                    <img class="post-img" src="/assets/uploads/images/{{ $event->event_image }}">
                                @else
                                    <img class="post-img" src="/assets/img/no-image.jpg">
                                @endif
                            </div>
                        </div>
                    </a>
                </div>
            @endforeach
        @else
            <div class="col-12 text-center">No record found!</div>
        @endif
    </div>
</div>

资源\视图\livewire\view-event.blade.php

<div wire:ignore.self id="showEventModal" class="modal fade come-from-modal right" tabindex="-1" role="dialog" aria-labelledby="showEventModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header white bg-red-dark borderless shadow-sm">
                <a type="button" class="back mr-4 white" data-dismiss="modal" aria-label="Close"><span aria-hidden="true"><i class="fas fa-chevron-left"></i></span></a>

                <div class="page-title">{{ $event_title }}</div>
            </div>

            <div class="modal-body">
                <input type="text" name="id" wire:model="event_id">

                <h1>This is {{ $event_id }}</h1>
            </div>
        </div>
    </div>
</div>

路线\web.php

<?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\MainController;

use App\Http\Livewire\Main;
use App\Http\Livewire\Dashboard;
use App\Http\Livewire\Events;

Auth::routes();

Route::group(['middleware' => 'auth'], function() {
    Route::get('/', [MainController::class, 'homepage'])->name('homepage');
    Route::get('/dashboard', Dashboard::class)->name('dashboard');
    Route::get('/events', Events::class)->name('events');
});

我到底做错了什么？我什至将引导模式的淡入淡出效果更改为像移动应用一样从右侧打开。

标签： laravelmodal-dialog

laravel - 如何在 Laravel Livewire 的引导模式中显示帖子记录？

问题描述

解决方案

推荐阅读