在 Laravel Livewire 中将值从一页传递到另一页

Question

我对 Livewire Laravel 很陌生，关于如何将值从一个页面传递到另一个页面，我有一个小问题。 我有两个 livewire 组件和刀片（Booklist 和 Book）和一个在 booklist 上呈现的表格，如下所示：

 <table> <tr> <th>ID</th> <th>Name</th> <th>Author</th> <th>Action</th> </tr> <tr> <td>1</td> <td>Harry Potter</td> <td>JK Rowling</td> <td><button>Details</button></td> </tr> <tr> <td>2</td> <td>Percy Jackson</td> <td>Rick Riordan</td> <td><button>Details</button></td> </tr> <tr> <td>3</td> <td>Game of Thrones</td> <td>George R.R. Martin</td> <td><button>Details</button></td> </tr> </table>

场景是当用户单击“详细信息”按钮时，它将移动到另一个页面（书籍）以显示该书的完整详细信息。 不幸的是，它至少无法传输该书的 ID。 我已经尝试了 livewire 上的 $emit 功能，但是它不起作用。

组件 1：

class Booklist extends Component
{
    public $data;
    public function render()
    {
        $this->data = Books::all();
        return view('livewire.bookstore.booklist');
    }

    public function getDetails($id){
        $this->emit('newPost', $id);
        return redirect()->to('bookstore/detail');
    }
}

组件 2：

class Book extends Component
{

    public $listeners = ['newPost'];
    public $numberid;
    public $data;

    public function render()
    {
        return view('livewire.bookstore.detail');
    }

    public function newPost($id){
        $this->numberid = $id->id;
    }

    public function checkifdata(){
        session()->flash('message','Number is ' . $this->numberid);
    }
}

Answer 1

如果您打算为书籍详细信息设置不同的页面，那么您可以简单地遵循整页组件呈现。

Route::get('/booklist', Booklist::class);
Route::get('/book/{$book}', Books::class);

书单组件

class Booklist extends Component
{
    public $books;

    public function mount()
    {
        $this->books = Books::all();
    }

    public function render()
    {
        return view('livewire.bookstore.booklist');
    }
}

单击详细信息，将发生Route Model 绑定。

@foreach($books as $book)
    <td><a href="{{ url('book/' . $book->id) }}">Details</a></td>
@endforeach

图书组件

class Book extends Component
{

    public $book;

    public function mount(Book $book)
    {
        $this->book = $book;
    }

    public function render()
    {
        return view('livewire.bookstore.detail');
    }
}