使用 laravel、vue.js 和 axios 删除 owl 幻灯片答案

【问题标题】：Delete a owl slide with laravel, vue.js and axios使用 laravel、vue.js 和 axios 删除 owl 幻灯片
【发布时间】：2019-02-24 02:26:31
【问题描述】：

我有一个不错的小滑块，它向页面访问者显示带有一些文字的图像。它在 vue 组件中使用 owl carousel，并且基本上可以按预期工作。我正在尝试添加一个删除按钮，以便创建滑块的用户可以删除图像，如果他们不喜欢它或其他什么。

我从控制器开始

public function destroy(Request $request, Slide $slide)
{
    $slide = Slide::where('id', $request->id);
    $slide->delete();

    return response()->json($slide, 200);
}

我有路线组 已编辑

    Route::group(['prefix' => '/{area}'], function () {
        Route::group(['middleware' => ['auth']], function () {
            Route::post('/{hustle}', 'Slides\SlideController@save')->name('slide.save');
            Route::delete('/{hustle}/slider/{slide}', 'Slides\SlideController@destroy')->name('slide.destroy');
        });
Route::get('/{hustle}/slider', 'Hustle\SliderController@index');
    });

按钮本身看起来就像这样

 <button @click="deleteSlide">Delete</button> {{ slider.uid }}

最后是方法

已编辑

methods: {
  getSlider () {
    var that = this;
    axios.get( '/' + this.areaId + '/' + this.hustleId + '/slider').then((response) => {
      that.sliders = response.data;
      console.log(that.sliders);
      Vue.nextTick(function() {

        $('#sliders').owlCarousel({
          items:1,
        });

      });
    })
    .catch(error => {
      console.log(error)
      this.errored = true
    });
  },

  deleteSlide (slider) {
    var that = this;
    axios.delete('/' + this.areaId + '/' + this.hustleId + '/slider/' + this.sliderId).then((response) => {
      that.slider.splice(slider, 1)
      console.log(that.sliderId);
    });

  }
},

我得到的所有错误都是 500 错误的方法调用，即使有，调试栏也会给出错误的方法调用。

【问题讨论】：

标签： javascript laravel-5 vue.js axios owl-carousel

【解决方案1】：

我没有足够的代表发表评论，但是...

乍一看，您的路线有两个参数：hustle 和 slide。
你正在向 axios 传递 4 个参数：区域、hustle、滑块字符串和 id

所以这是一条完全不同的路线:)

【讨论】：

它嵌套在另一个路由组 {area} 中，我错过了字符串，不错。仍然不完全正确，我得到了正确的回应。
太棒了，很高兴我能帮上忙
对不起，玛丽娜，我仍然收到方法不允许的错误。错字是正确的，但还是有什么地方有问题。
你能发布完整的路由文件和更新的 axios 调用代码吗？
我做了一些编辑，添加了其余的路由，并添加了组件中包含的所有方法。