删除带有拉拉维尔、vue.js 和 axios 的猫头鹰幻灯片

Question

我有一个漂亮的小滑块，它向页面访问者显示带有一些文本的图像。它在 vue 组件中使用猫头鹰轮播，并且基本上按预期工作。我正在尝试添加一个删除按钮，以便创建滑块的用户可以在不喜欢图像或其他内容时删除图像。

我从控制器开始

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}', 'SlidesSlideController@save')->name('slide.save');
Route::delete('/{hustle}/slider/{slide}', 'SlidesSlideController@destroy')->name('slide.destroy');
});
Route::get('/{hustle}/slider', 'HustleSliderController@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 个错误的方法调用，即使有，调试栏也会给出一个错误的方法调用。

Answer 1

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

乍一看，您的路线需要两个参数：喧嚣和滑梯。
您将 4 个参数传递给 axios：面积、喧嚣、滑块字符串和 id

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