0

Laravel および Vue Js で複数の行を削除する際に問題が発生しています。id の値を配列として取得できます。削除ボタンをクリックすると、ステータス 200 が表示されますが、データベースからレコードは削除されません。ここに私のコードがあります：私のテーブルで

 <tr v-for="user in users.data" :key="user.id">
                      <td>{{user.id}}</td>
                      <td>{{user.userName}}</td>
                     <td><input type="checkbox" :value="user.id" v-model="checkedNames"></td>
                       <button class="btn btn-warning" @click=" deleteAllUser()">Delete 
                       Selected</button>
                      </td>
                   </tr>

Vue Js

<script>
    export default {
        data(){
         return{
         checkedNames:[],

関数

deleteAllUser(){
    this.form.post('api/deletehotspotusers/',{id:this.checkedNames}).then(()=>{
                                                                       self.loadHotspotUsers();
                                }).catch(()=> {
                                    Swal.fire("Failed!", "There was something wrong.", "warning");
                                });
                         }
    }

私のコントローラーで

public function deleteAll(Request $request){
     if($request->id){
         foreach($request->id as $id){
            HotspotUsers::destroy($id);
         }
     }

私のルート

Route::post('/deletehotspotusers', 'HotspotUsersController@deleteAll');
4

2 に答える 2

0

deleteモデル レコードを削除するには、メソッドを呼び出す必要があります。コントローラーメソッドで以下を試すことができます

//import use statement at the top of the class
//use Illuminate\Support\Arr;
public function deleteAll(Request $request){
    if($request->id){
        HotspotUsers::whereIn('id', Arr::wrap($request->id))->delete();
    }
}

Vueでは、入力タイプのチェックボックス、v-modelはcheckedプロパティとchangeイベントを使用するため、v-modelはchecked状態に基づいてtrueまたはfalseを記録します。ID に user.id を入力するには、change イベントを利用する必要があります。

<tr v-for="user in users.data" :key="user.id">
    <td>{{user.id}}</td>
    <td>{{user.userName}}</td>
    <td>
        <input type="checkbox" :value="user.id" @change="onChecked(user.id)"> 
    </td>
    <td>
        <button class="btn btn-warning" @click=" deleteAllUser()">
            Delete Selected
        </button>
    </td>
</tr>

そして、メソッドのスクリプトセクションで

onChecked(id){
    if(!this.names.includes(id)){
       this.names.push(id)
    } else {
        this.names.splice(this.names.indexOf(id),1)
    }
}
于 2021-01-02T16:32:22.197 に答える