xzy的博客

文章目录通过Element ui往页面上加一个分页导航条需求在element ui官网选择Pagination分页组件UserList.vue组件的template模板中的分页组件的代码和效果分页组件牵涉到的data数据和methods方法测试通过Element ui往页面上加一个分页导航条需求加入一个分页条，此分页条可以跳转页面，可以根据页码选择具体页面，可以设置当前页面的大小。在element ui官网选择Pagination分页组件进入element ui官网，然后选择一个合适的分页组件，如

@RequestBody注解的使用@RequestBody注解的作用是：把前端传来的参数自动封装到后端的javabean对象中。使用过程如下：首先来看一下前端传递的json对象和后端的javabean对象的构造：后端中的Page对象，如下图：前端中的json对象，如下图：可以发现前端json对象和后端Page对象的属性名字是一一对应的，没错，如果它们不一一对应，那么是前端传递来的参数是无法自动封装到后端的Page对象的相关属性中的。接着看一下前端发送的异步请求，如下图：再来看看后端方法

@RequestBody注解的使用在SpringBoot的控制器的方法中，如果return一个字符串，那么程序默认会跳转到这个字符串所表示的页面，而@RequestBody注解的作用就是阻止这个功能的，这个注解可以让return的字符串直接返回到页面中或者直接返回到ajax的执行成功方法中。@RequestBody注解的使用过程，如下图：前端异步请求后端方法，如下图：后端接收前端的异步请求，并return返回处理请求的结果参数，如下图：...

@Param注解的使用动态代理接口向映射文件中传递参数的时候，会使用@Param注解，并且如果动态代理接口使用了@Param这个注解，那么映射文件中的标签中可以不用写parameterType属性，可以直接接收@Param中传递来的参数值。@Param注解的使用过程如下图：先来看一下动态代理接口中是怎样写的，如下图：再来看一下与动态代理接口对应的映射文件中是怎样接收参数的，如下图：...

文章目录SpringBoot+Vue前后端分离项目中实现删除用户功能需求给删除图标添加一个单击事件UserList.vue组件的deleteUser方法SpringBoot后端控制器中接收deleteuser请求的方法deleteUserUserDao动态代理接口中的deleteUser方法UserDao.xml映射文件中对应的sql语句UserList.vue组件中的getUserList方法UserList.vue组件中的分页数据SpringBoot后端控制器中接收pageuser请求的方法getUse

文章目录SpringBoot+Vue前后端分离项目中实现编辑用户功能需求给编辑按钮添加单击事件editUser方法SpringBoot后端接收selectuserbyid请求的方法UserDao动态代理接口中的selectUserById方法UserDao.xml映射文件中的sql语句编辑用户对话框的效果和代码editForm对象UserList.vue组件中的updateUser方法SpringBoot后端接收updateuser请求的方法editUserUserDao动态代理接口中的updateUser

文章目录添加用户功能的实现需求给添加用户按钮绑定单击事件添加用户的对话框的效果和代码添加用户对话框需要用到的UserList.vue组件中的数据UserList.vue组件中的addUser方法getUserList方法UserList.vue组件中的分页数据SpringBoot后端控制器中接收pageuser请求的方法getUserList动态代理接口UserDao中的getAllUser方法UserDao.xml映射文件中的sql语句addUser方法中执行完getUserList方法之后，会把查询到的

文章目录实现模糊查询用户的功能需求给搜索框绑定数据和方法getUserList方法UserList.vue组件中的分页数据SpringBoot后端控制器中接收pageuser请求的方法getUserList动态代理接口UserDao中的getAllUser方法UserDao.xml映射文件中的sql语句点击搜索框之后把getUserList方法查询到的分页数据渲染到UserList.vue组件显示用户信息的表格中测试实现模糊查询用户的功能需求在搜索框中，输入相关字段信息，可以根据此字段信息，对用户名进

文章目录UserList.vue组件中用钩子函数初始化第一页的分页数据需求created钩子函数的代码getUserList方法UserList.vue组件中的分页数据SpringBoot后端控制器中接收pageuser请求的方法getUserList动态代理接口UserDao中的getAllUser方法UserDao.xml映射文件中的sql语句把钩子函数初始化的分页数据渲染到UserList.vue组件中显示用户信息的表格中测试UserList.vue组件中用钩子函数初始化第一页的分页数据需求初始

文章目录实现导航菜单功能需求数据库中的表和java中的bean类钩子函数初始化菜单数据SpringBoot后端MenuController控制器接收"/menus"请求的getAllMenus方法MenuDao动态代理接口MenuDao.xml映射文件Home.vue组件中的路由嵌套使用element ui中的导航菜单生成菜单测试实现导航菜单功能需求点击不同的菜单，会在Home.vue的主体部分显示不同的组件内容。数据库中的表和java中的bean类数据库中需要两张表，一张是主菜单表mainmen

此项目是怎样使用axios的发送异步请求的？首先需要下载axios,使用命令npm install axios进行下载安装。接着，需要去src/main.js文件中挂载axios，如下图：然后，使用$http发送异步请求，如下图：

文章目录安全退出功能的实现需求给安全退出按钮绑定一个logout方法logout方法的内容测试安全退出功能的实现需求点击安全退出按钮，返回到登录页面。给安全退出按钮绑定一个logout方法logout方法的内容如下图：测试点击安全退出之后，如下图：...

文章目录vue脚手架项目默认访问页面index.html首页/src/main.js文件App.vue组件内容src/router/index.js文件内容Login组件内容测试vue脚手架项目默认访问页面index.html首页vue脚手架启动之后，默认会访问脚手架项目根目录下的index.html首页，如下图：/src/main.js文件/src/main.js文件的配置，如下图：App.vue组件内容App.vue组件的内容如下图：src/router/index.js文件内容

文章目录用户登录功能的实现在SpringBoot中配置数据库信息以及mybatis的相关信息数据库easyuser表和User实体类前端vue脚手架向SpringBoot后端发送登录请求SpringBoot后端的LoginController控制器的login方法UserDao动态代理接口中的getUserByMessage方法UserDao.xml映射文件路由跳转到Home.vue组件测试用户登录功能的实现在SpringBoot中配置数据库信息以及mybatis的相关信息如下图：数据库easyu

文章目录项目整体效果项目概述项目运行开启前后端项目运行效果输入前端Vue脚手架的启动地址路径登录后的首页查增改删分页导航条其它菜单退出项目整体效果项目概述此项目用到了Visual Studio Code会IDEA编译器，前端用的主要技术是Vue脚手架，后端用的主要技术是SpringBoot,实现了对健身会员的增删改查功能。项目运行开启前后端项目首先启动Visual Studio Code中的Vue脚手架项目，在terminal终端，输入命令npm run start后，如下图：接着去启动Sp