可以通过以下步骤通过GET请求从Vue JS前端向Laravel控制器发送对象请求:
/api/users?name=John&age=25
。Route::get
方法指定URL和相应的控制器方法。Request $request
来接收请求,并通过$request->input('name')
和$request->input('age')
来获取前端发送的对象的属性。下面是一个示例代码:
<template>
<div>
<input v-model="user.name" type="text" placeholder="Name">
<input v-model="user.age" type="number" placeholder="Age">
<button @click="getUserData">Get User Data</button>
</div>
</template>
<script>
import axios from 'axios';
export default {
data() {
return {
user: {
name: '',
age: 0
}
};
},
methods: {
getUserData() {
const { name, age } = this.user;
const url = `/api/users?name=${name}&age=${age}`;
axios.get(url)
.then(response => {
// 处理响应数据
console.log(response.data);
})
.catch(error => {
// 处理错误
console.error(error);
});
}
}
};
</script>
// Laravel 路由文件
Route::get('/api/users', 'UserController@getUserData');
// Laravel 控制器
use Illuminate\Http\Request;
class UserController extends Controller {
public function getUserData(Request $request) {
$name = $request->input('name');
$age = $request->input('age');
// 根据业务逻辑处理请求,并返回相应的数据
$userData = [
'name' => $name,
'age' => $age
];
return response()->json($userData);
}
}
这是一个简单的示例,展示了如何通过GET请求从Vue JS前端向Laravel控制器发送对象请求。根据实际需求和业务逻辑,你可以进一步扩展和优化代码。
领取专属 10元无门槛券
手把手带您无忧上云