如何将简单的用户输入从 Vue 传递到 Laravel 控制器？答案

【问题标题】：How to pass simple user input from Vue to Laravel Controller?如何将简单的用户输入从 Vue 传递到 Laravel 控制器？
【发布时间】：2021-03-20 12:08:09
【问题描述】：

我正在尝试使用 Laravel + Vue.js 创建一些简单的东西，而不必使用数据库。

我有两个来自 Vue 组件的输入，我想知道如何将这两个值传递回控制器。

通常你使用 Axios 来完成 CRUD 功能，但老实说我只是想将简单的值传递给后端，然后让后端将一个数组传回给 Vue 组件。

有什么建议吗？所有像样的在线教程通常都使用数据库来回传输数据。

【问题讨论】：

使用axios调用路由
如果您想使用 ajax 请求发送并且不想重新加载，请使用 axios 或 fetch。或者使用 form 标签和 post 方法和正确的操作 url。然后在关闭表单元素之前添加类型为submit 的按钮。提交后页面将刷新，您可以将任何数据从控制器传递给查看。

标签： laravel vue.js vue-component

【解决方案1】：

你听说过inertiajs吗？

inertiajs 允许您创建完全在客户端呈现的单页应用程序，而不会像现代 SPA 那样复杂。它通过利用现有的服务器端框架来做到这一点。

【讨论】：

【解决方案2】：

我能够使用 axios 来回发送数据

这是我的 Vue 组件：

<template> ... </template>
<script>
    export default {
    data() {
        return {
            name: '',
            days: ''
        }
    },
    methods: {
        getData() {
            axios.get('/api/urihere', {
                params: {
                    name: this.name,
                    days: this.days
                }
            }).then((response) => {
                console.log(response.data)
            }).catch((error) => {
                console.log(error)
            })
        }
      
    },
    mounted() {
        // 
    }
}

</script>

虽然我让你有一个简单的路线

Route::get('/urihere', [UrihereController::class, 'someMethod']);

在所述控制器内部

public function someMethod(Request $request)
{
    return [$request->name, $request->days];
}

【讨论】：