商城树形菜单递归显示

1 对应数据格式创建pojo类

public class ItemCat {
    //转换成json数据时使用u作为key
    @JsonProperty("u")
    private String url;
    
    @JsonProperty("n")
    private String name;
    
    @JsonProperty("i")
    private List<?> item;
}

2 返回值pojo

public class ItemCatResult {
    
    private List<?> data;

    public List<?> getData() {
        return data;
    }

    public void setData(List<?> data) {
        this.data = data;
    }
    
}

3 service层(理解递归遍历的思想)

@Service
public class ItemCatServiceImpl implements ItemCatService {

    @Autowired
    private TbItemCatMapper itemCatMapper;
    
    @Override
    public ItemCatResult queryAllCategory() throws Exception {
        
        ItemCatResult result = new ItemCatResult();
        result.setData(getItemCatList(0l));
        
        return result;
    }
    
    /**
     * 查询分类列表
     * <p>Title: getItemCatList</p>
     * <p>Description: </p>
     * @param parentid
     * @return
     */
    private List<?> getItemCatList(long parentid) {
        TbItemCatExample example = new TbItemCatExample();
        Criteria criteria = example.createCriteria();
        //查询parentid为0的分类信息
        criteria.andParentIdEqualTo(parentid);
        List<TbItemCat> list = itemCatMapper.selectByExample(example);
        List dataList = new ArrayList();
        for (TbItemCat tbItemCat : list) {
            //判断是否为父节点
            if (tbItemCat.getIsParent()) {
                ItemCat itemCat = new ItemCat();
                itemCat.setUrl("/category/" + tbItemCat.getId() + ".html");
                itemCat.setName(tbItemCat.getName());
                //递归调用
                itemCat.setItem(getItemCatList(tbItemCat.getId()));
                //添加到列表
                dataList.add(itemCat);
            } else {
                String catItem = "/item/" + tbItemCat.getId() + ".html|" + tbItemCat.getName();
                dataList.add(catItem);
            }
        }
        return dataList;
    }

}

4 controller层
TbItemcat表：

image.png

在maven中，当我们使用分布式结构时，建立多个web项目,启动多个服务器时候，服务器与服务器之间的请求响应就涉及到跨域的问题，跨域问题：浏览器一个安全的限制，不允许js跨域请求资源。
如图：

要返回json数据，还需要使用回调方法把json数据包装起来。所以需要controller添加回调支持，不能直接返回一个ItemCatResult对象。
方法一：
使用MappingJacksonValue对象包装返回结果，并设置jsonp的回调方法。

@RequestMapping("/all")
    @ResponseBody
    public MappingJacksonValue queryAll(String callback) throws Exception {
        //查询分类列表
        ItemCatResult result = itemCatService.queryAllCategory();
        //包装jsonp
        MappingJacksonValue jacksonValue = new MappingJacksonValue(result);
        //设置包装的回调方法名
        jacksonValue.setJsonpFunction(callback);
        
        return jacksonValue;
    }

方法二：
先把ItemCatResult对象转换成json字符串，然后使用字符串拼接的方法拼装成jsonp格式的数据。需要设置相应结果的MediaType。

@RequestMapping(value="/all", produces=MediaType.APPLICATION_JSON_VALUE + ";charset=utf-8")
    @ResponseBody
    public String queryAll(String callback) throws Exception {
        //查询分类列表
        ItemCatResult result = itemCatService.queryAllCategory();
        //把对象转换成json数据
        String jsonResult = JsonUtils.objectToJson(result);
        //拼接字符串
        String resultStr = callback + "(" + jsonResult + ");";
        
        return resultStr;
    }

5 页面实现

显示效果：

商城树形菜单递归显示

推荐阅读更多精彩内容