LaravelとVueでユーザーを削除をしたい。

Question

前提・実現したい事

選んだユーザーを削除したい。

発生している問題

削除の方は、response.dataはnullが出てしまいます。その為にaxios.requestに値を入れても挙動は、同じです。
エラーは出ておりません。

該当ソースコード

<?php

namespace App\Http\Controllers\Shop;

use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
use App\Models\User;
use Illuminate\Support\Facades\Log;
use Auth;

class HomeController extends Controller
{

    public function __construct()
    {
        $this->middleware('auth:shop');
    }
　　~~~~略（削除と編集処理）
    public function destroy(Request $request,User $user)
    {
        Log::info($request->delete);
        $result = $user->delete();
        return ['result' => $result];
    }
}

<?php
Route::get('/', function () {
    return view('user/welcome');
});

// ユーザー
~~~略（ユーザー権限）
// 管理者
Route::namespace('Shop')->prefix('shop')->name('shop.')->group(function () {

    // ログイン認証関連
    Auth::routes([
        'register' => true,
        'confirm'  => false,
        'reset'    => false
    ]);
    // ログイン認証後
    Route::middleware('auth:shop')->group(function () {
        // TOPページ
        // Route::resource('home', 'HomeController', ['only' => 'index']);
        Route::resource('home', 'HomeController')->only(['index', 'store', 'update', 'destroy']);
    });
});

~~~略（上記にbladeの内容を記述）

    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.2/axios.min.js"></script>
    <script>

        new Vue({
            el: '#app',
            data: {
                state: 'index',
                params: {
                    id: -1,
                    name: '',
                    email: '',
                    password: '',
                    passwordConfirmation: ''
                },
                users: [
                    // ユーザーデータをJSON化 ④
                    @foreach($users as $user)
                    {!! $user !!},
                    @endforeach
                ]
            },
            methods: {
                changeState(state, value) { // 状態を変化させて表示を切り替え ⑤

                    if(state === 'create') {

                        this.params = {
                            id: -1,
                            name: '',
                            email: '',
                            password: '',
                            passwordConfirmation: ''
                        };

                    } else if(state === 'edit') {

                        this.params = value;

                    }

                    this.state = state;

                },
                onSave() { // データ保存（追加＆変更） ⑥

                    const params = this.params;
                    let url = '/shop/home';
                    let method = 'POST';

                    if(this.state === 'edit') { // 変更の場合

                        url += '/'+ this.params.id;
                        
                        method = 'PUT';

                    }

                    axios({ url, method, params })
                        .then(response => {

                            if(response.data.result === true) {

                                location.reload(); // 再読み込み

                            }

                        });

                },
                onDelete(user) { // データ削除 ⑦
                    console.dir(user);
                    if(confirm('削除します。よろしいですか？')) {
                        console.dir(user);
                        const url = '/shop/home/'+ user.id;
                        axios.delete(url, { 
                            data: { id: user.id }
                            
                        }).then(response => {
                                console.log(response);
                                if(response.data.result === true) {

                                    location.reload(); // 再読み込み

                                }

                            });

                    }

                }
            }
        });

    </script>
</body>
</html>
@endsection

編集と追加は問題ないです。削除のみできないです。
他にソースが必要の場合や調査の仕方など教えて頂けると幸いです。

---2021/02/25 route:list 追加

$ php artisan route:list -v
+--------+-----------+------------------+-------------------+------------------------------------------------------------------------+----------------+
| Domain | Method    | URI              | Name              | Action                                                                 | Middleware     |
+--------+-----------+------------------+-------------------+------------------------------------------------------------------------+----------------+
|        | GET|HEAD  | /                |                   | Closure                                                                | web            |
|        | GET|HEAD  | api/user         |                   | Closure                                                                | api,auth:api   |
|        | GET|HEAD  | home             | user.home.index   | App\Http\Controllers\User\HomeController@index                         | web,auth:user  |
|        | GET|HEAD  | login            | user.login        | App\Http\Controllers\User\Auth\LoginController@showLoginForm           | web,guest:user |
|        | POST      | login            | user.             | App\Http\Controllers\User\Auth\LoginController@login                   | web,guest:user |
|        | POST      | logout           | user.logout       | App\Http\Controllers\User\Auth\LoginController@logout                  | web            |
|        | GET|HEAD  | register         | user.register     | App\Http\Controllers\User\Auth\RegisterController@showRegistrationForm | web,guest:user |
|        | POST      | register         | user.             | App\Http\Controllers\User\Auth\RegisterController@register             | web,guest:user |
|        | GET|HEAD  | shop/home        | shop.home.index   | App\Http\Controllers\Shop\HomeController@index                         | web,auth:shop  |
|        | POST      | shop/home        | shop.home.store   | App\Http\Controllers\Shop\HomeController@store                         | web,auth:shop  |
|        | PUT|PATCH | shop/home/{home} | shop.home.update  | App\Http\Controllers\Shop\HomeController@update                        | web,auth:shop  |
|        | DELETE    | shop/home/{home} | shop.home.destroy | App\Http\Controllers\Shop\HomeController@destroy                       | web,auth:shop  |
|        | POST      | shop/login       | shop.             | App\Http\Controllers\Shop\Auth\LoginController@login                   | web,guest:shop |
|        | GET|HEAD  | shop/login       | shop.login        | App\Http\Controllers\Shop\Auth\LoginController@showLoginForm           | web,guest:shop |
|        | POST      | shop/logout      | shop.logout       | App\Http\Controllers\Shop\Auth\LoginController@logout                  | web            |
|        | POST      | shop/register    | shop.             | App\Http\Controllers\Shop\Auth\RegisterController@register             | web,guest:shop |
|        | GET|HEAD  | shop/register    | shop.register     | App\Http\Controllers\Shop\Auth\RegisterController@showRegistrationForm | web,guest:shop |
+--------+-----------+------------------+-------------------+------------------------------------------------------------------------+----------------+

何卒宜しくお願い致します。

---2021/02/26 追加

現在動作確認で問題ないのは追加処理のみです。

Answer 1

yuki84web様

サーバー側で$requestの中身は問題無いですか？（意図するデータを受信できているか）

上記内容、解決の糸口になりました。
本当にありがとうございます！！！！

私自身、Vue.jsしか見えていなかったので。。。本当に情けないです（笑）

下記対応です。

修正前

    public function destroy(Request $request,User $user)
    {
        Log::info($request->delete);
        $result = $user->delete();
        return ['result' => $result];
    }

修正後

public function destroy(Request $request)
　　{
　　　　$user->id = $request['id'];
　　　　$result = User::where('id', $request['id'])->delete();
　　　　return ['result' => $result];
　　}

原因：
私的に$userでidが取れているものとおもっておりました。

Answer 2

route:listを掲載してください。ルーティングが設定されていない可能性があります

Comments

[mshmash]

返事頂きありがとうございます。
編集して再度アップ致します。

[mshmash]

私自身、後学の為Vue.js習い始めており。。。
管理画面は、Laravel単体で作成したので今度はVue.jsでやりたいと思いやってみたのですが。。。

文字数制限により書ききれないのでgithubの方に上げました。
※ソースの方は、試行錯誤して汚くなってしまってます。ご了承ください。
https://github.com/mash-pg/VueLaravel_Error

[yuki84web]

DELTEリクエストを送る場合はaxios.deleteになると思うのですが
https://github.com/axios/axios

[mshmash]

またしても返信頂きありがとうございます。
色々と説明などを抜かしていてのとソースがおかしなままでした。。。
申し訳ありません。
再度質問内容を編集致します。下記追加内容
axios.deleteで削除ができない（response.data.result === nullが原因？）
console.dirでresponse.data===nullになっているのを確認しました。
後、axiosのgithubがあったとは????しりませんでした。（普通そこ調べろよ。。。）
大変参考になりました。ありがとうございます。

https://blog.capilano-fw.com/?p=7481

やって見た事
const url = '/shop/home/'+ user.id;
axios.delete(url, {
data: { id: user.id }
});
やって見た事２
const url = '/shop/home/'+ user.id;
axios.delete(url, {
data: { id: user.id }

}).then(response => {
console.log(response);
if(response.data.result === true) {

location.reload(); // 再読み込み

}
});

[yuki84web]

サーバー側で$requestの中身は問題無いですか？（意図するデータを受信できているか）

[mshmash]

できてないです。。。
追記：編集処理もなぜか追加されている。。。
（再度コメントの方修正致します）

追加処理では、取れているみたいなのでちょっと頑張ってみます！！
※凡ミスの匂いな気がします。
ありがとうございます！！

[mshmash]

yuki84web様！！！！！

解決の糸口ありがとうございます！！！！
値の方は取得requestの方は取得できているのを確認して下記の対応をしたら動作できました。
controllerの記述

public function destroy(Request $request)
{
$user->id = $request['id'];
$result = User::where('id', $request['id'])->delete();
return ['result' => $result];
}

後は、気になる点があるので追って頑張ってみます。

[mshmash]

yuki84web様には色々と助けて頂いているのと大ヒントを頂いた（私自身これがベストの回答だと感じたので）ベストアンサーにさせて頂きました。本当にありがとうございます。