关于商品列表前端开发商品管理的问题

Question

老师好，我在进行商品管理的验证时，第一次会出现图一的情况，在点击新增按钮然后返回，会变为图二正常的情况，请问是什么原因呢？

Answer 1

翔仔 2019-05-12 01:22:24

修改后，记得清空页面缓存

• 提问者 慕仙8394361 #1

  老师好，我debug调试，在后端Controller层的getProductListByShop方法设置了断点，前端则是在function getList()下面设置了断点，前端点击下一步会直接跳到方法结束的地方，然后转到后端，后端的情况是：
  pageIndex和pageSize可以获取到，但是 currentShop  为null，这是什么情况呢？，我也查不出来问题在哪。

• 翔仔 回复 提问者 慕仙8394361 #2

  currentShop为空的话就是说Session没有设置，咱们Session一开始是直接硬编码给一个固定的shop，后来是在店家管理后台店铺列表里选择一个店铺进行管理的时候（也就是在店铺管理页)，会new一个shop的对象，并且shopId赋值为所选的那个店铺的shopId，将该shop对象设置到key为currentShop的session里面，后续从session里面就能获取到对应的currentShop即当前店铺了，只要站在业务的角度上理解的话是比较容易理解的，选择了店铺才能知道是哪个店铺，在哪个店铺里操作

• 提问者 慕仙8394361 #3

  非常感谢！

Answer 2

翔仔 2019-05-12 01:22:10

同学好，图1的情况同学需要看看为什么前端访问后端的方法没有被加载，需要在前端chrome开发者模式设置断点调试一下，以及后端Debug模式下看看controller的方法有没有被访问到，感觉还是哪里写错了

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112

$(function() {     // 获取此店铺下的商品列表的URL     var listUrl = '/o2o/shopadmin/getproductlistbyshop?pageIndex=1&pageSize=999';     // 商品下架URL     var statusUrl = '/o2o/shopadmin/modifyproduct';     getList();     /**      * 获取此店铺下的商品列表      *       * @returns      */     function getList() {         // 从后台获取此店铺的商品列表         $.getJSON(listUrl, function(data) {             if (data.success) {                 var productList = data.productList;                 var tempHtml = '';                 // 遍历每条商品信息，拼接成一行显示，列信息包括：                 // 商品名称，优先级，上架\下架(含productId)，编辑按钮(含productId)                 // 预览(含productId)                 productList.map(function(item, index) {                     var textOp = "下架";                     var contraryStatus = 0;                     if (item.enableStatus == 0) {                         // 若状态值为0，表明是已下架的商品，操作变为上架(即点击上架按钮上架相关商品)                         textOp = "上架";                         contraryStatus = 1;                     } else {                         contraryStatus = 0;                     }                     // 拼接每件商品的行信息                     tempHtml += '' + '<div class="row row-product">'                             + '<div class="col-33">'                             + item.productName                             + '</div>'                             + '<div class="col-20">'                             + item.point                             + '</div>'                             + '<div class="col-40">'                             + '<a href="#" class="edit" data-id="'                             + item.productId                             + '" data-status="'                             + item.enableStatus                             + '">编辑</a>'                             + '<a href="#" class="status" data-id="'                             + item.productId                             + '" data-status="'                             + contraryStatus                             + '">'                             + textOp                             + '</a>'                             + '<a href="#" class="preview" data-id="'                             + item.productId                             + '" data-status="'                             + item.enableStatus                             + '">预览</a>'                             + '</div>'                             + '</div>';                 });                 // 将拼接好的信息赋值进html控件中                 $('.product-wrap').html(tempHtml);             }         });     }     // 将class为product-wrap里面的a标签绑定上点击的事件     $('.product-wrap')             .on(                     'click',                     'a',                     function(e) {                         var target = $(e.currentTarget);                         if (target.hasClass('edit')) {                             // 如果有class edit则点击就进入店铺信息编辑页面，并带有productId参数                             window.location.href = '/myo2o/shopadmin/productoperation?productId='                                     + e.currentTarget.dataset.id;                         } else if (target.hasClass('status')) {                             // 如果有class status则调用后台功能上/下架相关商品，并带有productId参数                             changeItemStatus(e.currentTarget.dataset.id,                                     e.currentTarget.dataset.status);                         } else if (target.hasClass('preview')) {                             // 如果有class preview则去前台展示系统该商品详情页预览商品情况                             window.location.href = '/myo2o/frontend/productdetail?productId='                                     + e.currentTarget.dataset.id;                         }                     });     function changeItemStatus(id, enableStatus) {         // 定义product json对象并添加productId以及状态(上架/下架)         var product = {};         product.productId = id;         product.enableStatus = enableStatus;         $.confirm('确定么?', function() {             // 上下架相关商品             $.ajax({                 url : statusUrl,                 type : 'POST',                 data : {                     productStr : JSON.stringify(product),                     statusChange : true                 },                 dataType : 'json',                 success : function(data) {                     if (data.success) {                         $.toast('操作成功！');                         getList();                     } else {                         $.toast('操作失败！');                     }                 }             });         });     } });