在 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');
    }
}