SpringBoot+Vue项目完成之路(二)——前后端连接测试
(一)前端页面
前端页面我是在 Visual Studio Code(简称VS)开发的,打开VS软件,打开之前已经建立好的项目——cotea(这是我的项目名)
打开之后的截图如下:
1、login.vue
(1)建立login.vue文件:cotea——>src——>compenents——>新建文件,然后命名为login.vue即可
(2)简易登录图如下:
代码如下:
<template>
<div>
用户名:<input type="text" v-model="loginForm.username" placeholder="请输入用户名"/>
<br>
<br>
密码: <input type="password" v-model="loginForm.password" placeholder="请输入密码"/>
<br><br>
<button v-on:click="login">登录</button>
</div>
</template>
<script>
export default {
name:'Login',
data(){
return{
loginForm:{
username:'',
password:''
},
responseResult: []
}
},
methods:{
login(){
this.$axios
.post('/login',{