Question

我正在尝试实现一种功能，使用户可以使用javascript来喜欢和不喜欢产品，我遵循此Laravel - Favourite / Un-Favourite button，但是它对我不起作用，无法单击按钮，关于我如何操作的任何想法可以解决这个问题吗？

路线

Route::get('product/like/{id}', ['as' => 'product.like', 'uses' =>   'LikeController@likeProduct']);
Route::get('product/{product}/unlike','LikeController@destroy')->name('product.unlike');

JavaScript

 <script>

function addToFavourites(productid, userid) {
var user_id = userid;
var product_id = productid;

$.ajax({
    type: 'post',
    url: 'product/like/{id}',
    data: {
        'user_id': user_id,
        'product_id': product_id,
    },
    success: function () {
        // hide add button
        $('#addfavourites' + product_id).hide();
        // show delete button
        $('#deletefavourite' + product_id).show();
    },
    error: function (XMLHttpRequest) {
        // handle error
    }
});
}

刀片文件

   @if($product->isLiked)
      <div id="addfavourites{{$product->id}}" onClick="addToFavourites({{$product->id}}, {{ Auth::user()->id }})"> unlike </div>
       @else
       <div id="deletefavourite{{$product->id}}" onClick="deleteFromFavourites({{$product->id}}, {{ Auth::user()->id }})" > like </div>
    @endif

Answer 1

使路线接受post方法，因为您是通过Ajax发布的

Route::post('product/like/{id}', ['as' => 'product.like', 'uses' => 'LikeController@likeProduct']);
Route::post('product/{product}/unlike', 'LikeController@destroy')->name('product.unlike');

并使用ES6模板字符串，并将CSRF令牌标头添加到Ajax请求

function addToFavourites(productid, userid) {
    // Redundant
    // var user_id = userid;
    // var product_id = productid;
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    $.ajax({
        method: 'post',
        url: `/product/like/${productid}`, // Use ES6 template and point to the url from root /
        data: {
            'user_id': userid,
            'product_id': productid,
        },
        success: function () {
            // hide add button
            $('#addfavourites' + productid).hide();
            // show delete button
            $('#deletefavourite' + productid).show();
        },
        error: function (XMLHttpRequest) {
            // handle error
        }
    });
}

希望这会有所帮助

喜欢和不喜欢javascript和Laravel

1 个答案: