在Vue程序中编写代码来向Express程序发送请求,以验证登录信息
时间: 2024-03-27 09:41:10 浏览: 11
好的,您可以在Vue中使用axios库来向Express发送请求。在登录页面中,您可以编写以下代码:
```
<template>
<div>
<h1>Login Page</h1>
<form @submit.prevent="submitForm">
<label>Username:</label>
<input type="text" v-model="username">
<label>Password:</label>
<input type="password" v-model="password">
<button type="submit">Login</button>
</form>
</div>
</template>
<script>
import axios from 'axios';
export default {
data() {
return {
username: '',
password: ''
}
},
methods: {
submitForm() {
axios.post('/api/login', {
username: this.username,
password: this.password
})
.then(response => {
console.log(response.data);
// do something with response
})
.catch(error => {
console.log(error.response.data);
// handle error
});
}
}
}
</script>
```
在上面的代码中,我们使用了axios库来向Express发送POST请求。我们通过在表单中输入用户名和密码,然后在submitForm方法中调用axios.post方法来发送请求。请求的URL是`/api/login`,这是Express中处理登录请求的路由。我们还将用户名和密码作为请求的数据发送。在请求成功后,我们可以通过response.data获取服务器响应的数据。在请求失败时,我们可以通过error.response.data获取错误响应的数据。