进入页面,根据后台传过来的flag 判断列表隐藏与否

需求描述:页面中有两个列表,一个已添加,一个可以添加,进入页面的时候,如果已添加中有数据则显示,没有数据就隐藏,emmmm,这种需求,我该怎么吐槽嗷嗷嗷

解决思路:让已添加的列表的div默认隐藏,前台接收后台传递过来的标志(该标志是已添加列表是否有数据),如果有,就把已添加列表的div设置为显示

代码:

//html代码
<div class="row" id="tableDivOne" style="display: none;">
  <table>
   //列表中间内容省略
  </table>
</div> //后台java代码
map.addAttribute("listed", list);
return VIEW_PATH + "/toAddProd";

//js代码
var prodAdded = [[${listed}]]; //接收传过来的list
if (CommnUtil.notNull(prodAdded)) {
  //如果prodADDed的长度大于0说明已添加列表有数据
if (prodAdded.length > 0) {
document.getElementById("tableDivOne").style.display="block";//显
}
}

啰嗦一句:别的代码也可以实现  下边是同事的代码:

//html代码
<div class="row" id="addedDiv" hidden="hidden">
  <table>
   //····
  </table>
</div> //js代码
var addedIds = [[${addedList}]];
if (CommnUtil.notNull(addedIds)) {
if (addedIds.length > 0) {
$("#addedDiv").prop('hidden', false);
}
}

总结:推荐用我的哈O(∩_∩)O哈哈~,为啥呢  原生js兼容性肯定比他的好啊

上一篇:Spring Boot Web开发与thymeleaf模板引擎


下一篇:企业级账号更新app