Javascript 如何解决删除modal vue.js时出现的500（内部服务器错误）？

我的看法是这样的：

@foreach($account_list as $account)
<table class="table table-bordered">
    ...
        <li>
            <a href="javascript:;" @click="modalShow('modal-delete-account',{{ $account['id'] }})">
                <span class="glyphicon glyphicon-trash"></span>&nbsp;Delete
            </a>
        </li>
    ...
</table>
@endforeach

<template>
    <div class="modal" tabindex="-1" role="dialog">
        ...
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-success" @click="deleteAccount">OK</button>
            </div> 
        ...
    </div>
</template>

<script>
    export default{
        name: 'DeleteAccountModal',
        props:['idAccount'],
        methods:{
            deleteAccount(event){
                event.target.disabled = true
                const payload= {id_account: this.idAccount}
                this.$store.dispatch('deleteAccount', payload);
                window.location.reload(true)
            }
        }
    }
</script>

Route::group(['middleware' => 'auth', 'prefix'=>'member', 'as'=>'member.'], function () {
    ...
    Route::group(['prefix' => 'profile', 'as'=>'profile.'], function () {
        ...
        Route::post('setting/account/delete', 'Member\UserBankController@deleteAccount');
        ...
    });
    ...
});

public function deleteAccount(Request $request)
{
    $id_account = $request->input('id_account');
    try{
        if($this->user_service->deleteAccount($id_account)) {
            return $this->respond(['status' => 'Success']);
        }else {
            return $this->respond(['status' => 'Failed Delete']);
        }
    }catch (\Exception $exception){
        return $this->respondInternalError();
    }
}

public function deleteAccount($id)
{
    return $this->user_bank_repository->delete($id);
}

public function delete($id)
{
    $data = self::find($id)->delete();

    return $data;
} 

我的account.js（resources\assets\js\api\account.js）是这样的：

import Vue from 'vue'
import Resource from 'vue-resource'
Vue.use(Resource)
export default {
    ...
    delete (account, cb, ecb = null ) {
        Vue.http.post(window.Laravel.baseUrl+'/member/profile/setting/account/delete', account)
            .then(
            (resp) => cb(resp.data),
            (resp) => ecb(resp.data)
        );
    },
    ...
}

我的控制器是这样的：

@foreach($account_list as $account)
<table class="table table-bordered">
    ...
        <li>
            <a href="javascript:;" @click="modalShow('modal-delete-account',{{ $account['id'] }})">
                <span class="glyphicon glyphicon-trash"></span>&nbsp;Delete
            </a>
        </li>
    ...
</table>
@endforeach

<template>
    <div class="modal" tabindex="-1" role="dialog">
        ...
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-success" @click="deleteAccount">OK</button>
            </div> 
        ...
    </div>
</template>

<script>
    export default{
        name: 'DeleteAccountModal',
        props:['idAccount'],
        methods:{
            deleteAccount(event){
                event.target.disabled = true
                const payload= {id_account: this.idAccount}
                this.$store.dispatch('deleteAccount', payload);
                window.location.reload(true)
            }
        }
    }
</script>

Route::group(['middleware' => 'auth', 'prefix'=>'member', 'as'=>'member.'], function () {
    ...
    Route::group(['prefix' => 'profile', 'as'=>'profile.'], function () {
        ...
        Route::post('setting/account/delete', 'Member\UserBankController@deleteAccount');
        ...
    });
    ...
});

public function deleteAccount(Request $request)
{
    $id_account = $request->input('id_account');
    try{
        if($this->user_service->deleteAccount($id_account)) {
            return $this->respond(['status' => 'Success']);
        }else {
            return $this->respond(['status' => 'Failed Delete']);
        }
    }catch (\Exception $exception){
        return $this->respondInternalError();
    }
}

public function deleteAccount($id)
{
    return $this->user_bank_repository->delete($id);
}

public function delete($id)
{
    $data = self::find($id)->delete();

    return $data;
} 

我的服务是这样的：

@foreach($account_list as $account)
<table class="table table-bordered">
    ...
        <li>
            <a href="javascript:;" @click="modalShow('modal-delete-account',{{ $account['id'] }})">
                <span class="glyphicon glyphicon-trash"></span>&nbsp;Delete
            </a>
        </li>
    ...
</table>
@endforeach

<template>
    <div class="modal" tabindex="-1" role="dialog">
        ...
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-success" @click="deleteAccount">OK</button>
            </div> 
        ...
    </div>
</template>

<script>
    export default{
        name: 'DeleteAccountModal',
        props:['idAccount'],
        methods:{
            deleteAccount(event){
                event.target.disabled = true
                const payload= {id_account: this.idAccount}
                this.$store.dispatch('deleteAccount', payload);
                window.location.reload(true)
            }
        }
    }
</script>

Route::group(['middleware' => 'auth', 'prefix'=>'member', 'as'=>'member.'], function () {
    ...
    Route::group(['prefix' => 'profile', 'as'=>'profile.'], function () {
        ...
        Route::post('setting/account/delete', 'Member\UserBankController@deleteAccount');
        ...
    });
    ...
});

public function deleteAccount(Request $request)
{
    $id_account = $request->input('id_account');
    try{
        if($this->user_service->deleteAccount($id_account)) {
            return $this->respond(['status' => 'Success']);
        }else {
            return $this->respond(['status' => 'Failed Delete']);
        }
    }catch (\Exception $exception){
        return $this->respondInternalError();
    }
}

public function deleteAccount($id)
{
    return $this->user_bank_repository->delete($id);
}

public function delete($id)
{
    $data = self::find($id)->delete();

    return $data;
} 

我的存储库如下所示：

@foreach($account_list as $account)
<table class="table table-bordered">
    ...
        <li>
            <a href="javascript:;" @click="modalShow('modal-delete-account',{{ $account['id'] }})">
                <span class="glyphicon glyphicon-trash"></span>&nbsp;Delete
            </a>
        </li>
    ...
</table>
@endforeach

<template>
    <div class="modal" tabindex="-1" role="dialog">
        ...
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-success" @click="deleteAccount">OK</button>
            </div> 
        ...
    </div>
</template>

<script>
    export default{
        name: 'DeleteAccountModal',
        props:['idAccount'],
        methods:{
            deleteAccount(event){
                event.target.disabled = true
                const payload= {id_account: this.idAccount}
                this.$store.dispatch('deleteAccount', payload);
                window.location.reload(true)
            }
        }
    }
</script>

Route::group(['middleware' => 'auth', 'prefix'=>'member', 'as'=>'member.'], function () {
    ...
    Route::group(['prefix' => 'profile', 'as'=>'profile.'], function () {
        ...
        Route::post('setting/account/delete', 'Member\UserBankController@deleteAccount');
        ...
    });
    ...
});

public function deleteAccount(Request $request)
{
    $id_account = $request->input('id_account');
    try{
        if($this->user_service->deleteAccount($id_account)) {
            return $this->respond(['status' => 'Success']);
        }else {
            return $this->respond(['status' => 'Failed Delete']);
        }
    }catch (\Exception $exception){
        return $this->respondInternalError();
    }
}

public function deleteAccount($id)
{
    return $this->user_bank_repository->delete($id);
}

public function delete($id)
{
    $data = self::find($id)->delete();

    return $data;
} 

当我单击delete按钮时，它将显示一个带有vue.js的模式。之后，我点击ok按钮将其删除。但没有记录被删除

在控制台上，如下所示：

@foreach($account_list as $account)
<table class="table table-bordered">
    ...
        <li>
            <a href="javascript:;" @click="modalShow('modal-delete-account',{{ $account['id'] }})">
                <span class="glyphicon glyphicon-trash"></span>&nbsp;Delete
            </a>
        </li>
    ...
</table>
@endforeach

<template>
    <div class="modal" tabindex="-1" role="dialog">
        ...
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-success" @click="deleteAccount">OK</button>
            </div> 
        ...
    </div>
</template>

<script>
    export default{
        name: 'DeleteAccountModal',
        props:['idAccount'],
        methods:{
            deleteAccount(event){
                event.target.disabled = true
                const payload= {id_account: this.idAccount}
                this.$store.dispatch('deleteAccount', payload);
                window.location.reload(true)
            }
        }
    }
</script>

Route::group(['middleware' => 'auth', 'prefix'=>'member', 'as'=>'member.'], function () {
    ...
    Route::group(['prefix' => 'profile', 'as'=>'profile.'], function () {
        ...
        Route::post('setting/account/delete', 'Member\UserBankController@deleteAccount');
        ...
    });
    ...
});

public function deleteAccount(Request $request)
{
    $id_account = $request->input('id_account');
    try{
        if($this->user_service->deleteAccount($id_account)) {
            return $this->respond(['status' => 'Success']);
        }else {
            return $this->respond(['status' => 'Failed Delete']);
        }
    }catch (\Exception $exception){
        return $this->respondInternalError();
    }
}

public function deleteAccount($id)
{
    return $this->user_bank_repository->delete($id);
}

public function delete($id)
{
    $data = self::find($id)->delete();

    return $data;
} 

存在错误：500（内部服务器错误）

---

如何解决这个问题？

检查您的PHP错误日志！在浏览器开发工具的网络选项卡上单击ajax请求，然后单击响应选项卡。这将为您提供laravel对您的请求的响应。@Joe，我还没有时间单击选项卡响应。因为错误很快就消失了。这是因为重定向page@moses如果您使用的是chrome，只需勾选“保留日志”复选框，网络选项卡条目将在重新加载时保持不变。@Joe，太好了。它起作用了。谢谢