一个关于导航栏的坑！（自己基础薄弱~）

自己挖的一个大坑，关于后端往前端传值的坑！

前后端交互没问题，数据正常交互。

突然！后端传送过来的一个 map集合，获取成功了，但是无法调用，数据就在眼前，想通过 v-for 渲染，就是调不出来。

经过大神解惑，map的原理是 K V ,映射关系，调用的时候是 map.key

问题重现：

后端传送过来的map数据是 这样的：   这尼玛就是一个对象啊，才疏学浅，调了半天，白搭

data: {"导航" : ["内容a","内容b","内容c"],"导航2" : ["c++","java","aython"] } 

假设此时想要获取到 -- 导航 --，这两个字，是获取不到的，我是试了很久，绕晕了，后来问了问了大神，人家说：

就假设是如上的数据（后端返回的 Map类型数据），想要获取的话 只能是  data.导航，但是这么着获取的不是 -- 导航 --两个字，而是后面的数组，而且中文会出问题，最好是英文；

后来从后端找问题，最后发现  错误在这里

 serviceImpl的方法中，关于回传返回值这里

出错版：

       Map resMap = new HashMap();
        for(int i=0;i<list.size();i++) {
            String groupName = list.get(i).getGroupName();
            List<String> items = Arrays.asList(list.get(i).getNames().split(","));
           
            map.put(groupName,items);
            resMap.add(map);
        }
         
        return resMap;

 

上述代码是把需要的内容返回成功了，但是 groupName  是中文的啊喂！
调用的时候 data."汉字" 那不是扯犊子吗？前端读取不到这么调用的数据

改正版：
 List<Map> resMap = new ArrayList<Map>();
        for(int i=0;i<list.size();i++) {
            String groupName= list.get(i).getGroupName);
            List<String> names = Arrays.asList(list.get(i).getNames().split(","));
            Map map = new HashMap();
            map.put("id",i);
            map.put("groups",groupName);
            map.put("items",names);
            resMap.add(map);
        }
        return resMap;

正确的数据传送过来了：  这才是数组啊，可以用 . 访问

data: [{groups: "编程", id: 0,items:["Python", "Java","C++"]},{groups: "运动", id: 1,items:["滑雪", "爬山","敲代码"]}]

此时想要v-for 调用

v-for="item in navList"

item.id     // 0

item.groups   // 编程