Render data when I click the button?

#1

I have sideBar menu I put into it the products in cart for each user so I did the normal way, the query inside render method and foreach then in blade component, but when check the debggbar I see there is query once the page opened! So I need when the side bar is opened render the data otherwise don’t render it

there is a button to open the side bar:

<button
    wire:click="addToCart"
    class="btn btn-success add-to-cart"
>
   add_to_cart
</button>


class SlideCart extends Component
{
    protected $listeners = [
        'slideCart:update' => '$refresh',
    ];

    public function removeProduct($id){
        user()->cart()->detach($id);
    }

    public function render()
    {
        $products = user()->cart()->mainImage()->get();

        return view('livewire.user.slide-cart',compact('products'));
    }
}
#2

@jean
What you are missing in your component is a public function addToCart. Something like this:

class SlideCart extends Component
{
...
  public function addToCart()
  {
      // add your code here
      // or dd($this);
  }
#3

I have this already, my question was how can I render data after click button not after it?

#4

I think if it’s a function you should do this wire:click=“addToCart({{$product-id}})” with parenthesis