2023-01-05
一 、CommonResult工具
1 、CommonResult工具的目的是:为了方便团队开发 。一般是在使用异步的时候使用 。
2 、CommonResult工具的使用:
(1)前端发送异步请求到servlet 。
(2)servlet给响应数据的时候 ,将所有数据都封装到CommonResult对象内 。
二 、清空购物车
2.1 找到清空购物车的超链接
(1)cart.html中的第67行
(2)在"CartServlet"中新建一个方法
protected void clearCart(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.getSession().removeAttribute("cart");
//将页面跳转设置到cart.html
this.processTemplate("cart/cart",request,response);
}
(3)在cart.html中的第52行中添加
<tbody v-if="totalCount==0">
<tr>
<td colspan="6" align="center">购物车为空 ,请点击继续购物</td>
</tr>
</tbody>
三 、删除购物项
3.1 找到删除的超链接
(1)找到“cart.html ”中的第65行 ,使用“异步 ”方式(绑定一个函数)
<td><a href="" @click="deleteCartItem">删除</a></td>
(2)在Vue中触发一个函数 ,“cart.html ”中的第167行
deleteCartItem:function(){
//发布异步请求删除当前购物项(将图书的id带过去)
axios({
method:"post",
url:"cart",
params:{
flag:"deleteCartItem",
}
});
event.preventDefault();//阻止控件的默认行为
}
(3)在超链接上绑定一个"name"属性
<td><a href="" @click="deleteCartItem" :name="cartItem.book.bookId">删除</a></td>
(4)获取“name ”属性的值,在"cart.html"中的第169行
var id=event.target.name;
(5)将id传到“params ”中
(6)在"CartServlet"中设置一个方法
protected void deleteCartItem(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1.获得请求参数
String id = request.getParameter("id");
//2.获得购物车对象
HttpSession session = request.getSession();
Cart cart = (Cart)session.getAttribute("cart");
//3.调用cart中的方法删除购物项
}
(7)到"Cart.java"中写一个“删除的方法 ”
/**
* 功能:删除购物项
* @param id
*/
public void deleteCartItem(Integer id){
map.remove(id);
}
(8)接着写刚才的方法
protected void deleteCartItem(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1.获得请求参数
String id = request.getParameter("id");
//2.获得购物车对象
HttpSession session = request.getSession();
Cart cart = (Cart)session.getAttribute("cart");
//3.调用cart中的方法删除购物项
cart.deleteCartItem(Integer.parseInt(id));
//4.后台的数据删除成功了 ,但是前台不刷新 。因为是异步请求
showCart(request,response);
}
(9)转到刚才的“cart.html ”中
deleteCartItem:function(){
//发布异步请求删除当前购物项(将图书的id带过去)
axios({
method:"post",
url:"cart",
params:{
flag:"deleteCartItem",
}
}).then(response=>{
if(response.data.flag){
//需要将后台传过来的数据 ,展示在网页上(Vue的方式)
this.cartItems=response.data.resultData[0];
this.totalCount=response.data.reultData[1];
this.totalAmount=response.data.resultData[2];
}
});
event.preventDefault();//阻止控件的默认行为
}
声明:本站所有文章 ,如无特殊说明或标注 ,均为本站原创发布 。任何个人或组织 ,在未征得本站同意时 ,禁止复制 、盗用 、采集 、发布本站内容到任何网站 、书籍等各类媒体平台 。如若本站内容侵犯了原著者的合法权益 ,可联系我们进行处理 。