当前位置：首页 > news >正文

关于SPring基础和Vue的学习

news 2025/7/26 15:20:13

@RestController和普通的@Controller的区别

普通的@Controller需要@RespondBody来给前端返回对象

传统的MVC设计模型：Model View Controller

servlet的生命周期

1.init() 用来new一个servlet

2.service()

3.distroy()

servlet容器：Tomcat

Http协议：获取请求和作出相应

HttpServletRequest：Http协议里面的请求

HttpServletResponse：Http协议里面的响应

request和response两个对象是前端发送http协议的时候创建的，给前端返回http协议的时候摧毁的

Controller的核心类是DispatchServlet（Tomcat只存储这一个类）

通过url对应相应的Controller，它们存储在Spring容器中

Vue里的element表达式

组件 | Element<==这里查询组件信息

在图书借阅明细信息中添加用户搜索框dialog

首先加入focus实现点击输入框就弹出dialog

<el-form-item label="借阅人" prop="borrowUser"><el-input placeholder="请输入借阅人" @focus="udShow"/><el-input type="hidden" v-model="form.borrowUser"></el-input></el-form-item>

让输入框显示借阅人名字，但实际要加入表单的是借阅人id，所以后面加一个隐藏的input，type为hidden，来获取选择借阅人的id传入表单

udShow的实现（暂时只弹出dialog和列出user表）

udShow(){this.udopen=truethis.getUserList();},

getUserList()实现

getUserList(){listUser().then(response =>{this.userList = response.rowsthis.total = response.total})}

实现显示用户信息

 <el-dialog width="850px" :visible.sync="udopen" :title="udtitle"><el-form></el-form><el-table v-loading="loading" :data="userList" @selection-change="handleUserSelectionChange"><el-table-column type="selection" width="50" align="center" /><el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" /><el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber"  width="120" /><el-table-column label="状态" align="center" key="status" ><template slot-scope="scope"><el-switch v-model="scope.row.status" active-value="0" inactive-value="1" ></el-switch></template></el-table-column></el-table></el-dialog>

dialog里的visible属性为true则打开页面，设置为false则为关闭页面

定义udopen的初始值

  data(){return{...   //是否弹出用户选择图层udopen: false,//选择用户的标题udtitle:"选择用户",...

多选框函数的实现“handleUserSelectionChange”

handleUserSelectionChange(selection) {this.ids = selection.map(item => item.userId)this.single = selection.length !== 1this.multiple = !selection.length},

将传入的 selection 数组通过 map 方法转换为一个仅包含 userId 的新数组，并赋值给 this.ids。假设 selection 是用户选中项的集合，此操作提取所有选中项的 userId 字段

当selection的长度不是1的话给single赋值为true--单选的话single为false

若长度为0则给multiple设置为true--啥也没选就返回true

----实现结果截图