vue.jsの画面からPOSTされたデータをlaravelで受け取りたい

Question

前提

vue.jsとlaravelを連携したサービスを開発しています

実現したいこと

ここに実現したいことを箇条書きで書いてください。

• vue.jsからPOSTされた値を使ってlaravelでDBを書き換える

該当のソースコード

画面側の送信処理は以下の通りです
ブラウザの開発ツールのネットワークタブで/comebackへのPOST通信が
ステータス200になっていること
ペイロードでtwitter_screen_nameの値が入っていることを確認ずみです

    <div class="c-textbox__header u-text__title">凍結解除されたアカウント
        <div v-if="comebackAccounts && comebackAccounts.length">
            <div v-for="comeback in comebackAccounts" :key="comeback.twitter_screen_name">
                <table class="c-table">
                    <tr>
                        <th>アカウント名</th>
                        <td>{{ comeback.twitter_screen_name }}</td>
                    </tr>
                </table>
                <el-button @click.once="onPost(comeback.twitter_screen_name)" type="info" plain>自動機能を再開する</el-button>
            </div>
        </div>
        <div v-else>
            <div class="u-text__pattern3 u-mtb30">
                該当するアカウントはありません
            </div>
        </div>
    </div>

</template>

<script>
export default {
    props: {
        comebackAccounts: Array,
    },
    data() {
        return {};
    },
    methods: {
        onPost: function (twitter_screen_name) {
            axios.post("/comeback", {
                twitter_screen_name,
            })
        },
    },
}
</script>

laravel側で受け取りの処理を書いたのですが
request内容を出力しようとしたvar_dumpに何も出力されていません

        public function comeback(Request $request){
            var_dump($request);
            $twitter_screen_name = $request->twitter_screen_name;
            Log::debug($twitter_screen_name);
            DB::table('twitter_tokens')
                ->where('twitter_screen_name', $twitter_screen_name)
                ->update(['suspended_flg' => SuspendedFlg::getValue('正常')]);
            return redirect('/home')->with('c_flash', '凍結解除しました！');
        }

送り方と受け取り方で確認が必要な箇所はどこになるでしょうか？

補足情報（FW/ツールのバージョンなど）

Laravel v8.83.23
PHP v7.4.18
"vue": "^3.2.36",

Answer 1

web.phpでvueとlaravelを連携しようとしていましたが
api.phpで実装してみようと思います

Answer 2

axiosの使い方が間違っているように見えます。

axios.post("/comeback", {
    twitter_screen_name: twitter_screen_name,
})

Comments

[ttpk]

回答をありがとうございます
書いていただいたコードに差し替えてみましたが、結果は変わりませんでした。。。

[watage]

あ。ですよね。すみません。
> ペイロードでtwitter_screen_nameの値が入っていることを確認ずみです
こちらを見落としていたので、削除依頼出したのですが間に合いませんでした。

[watage]

ただ、マニュアルを見ると
axios.post('/user', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
となっているので書き方は変えた方がいいかもしれないです。
また、var_dumpで何も出ないとの事なので、Laravel側まで到達しているか確認した方が良さそうです。

[watage]

web.phpかapi.phpの書き方が合っているか確認した方がいいかもしれません。

[ttpk]

返信遅くなり大変申し訳ありません。。。
web.phpでvueとlaravelを連携しようとしていましたが
api.phpで実装してみようと思います