Silence-wen
2020-05-24 00:40
采纳率: 100%
浏览 945
已采纳

vue v-for循环map时获取不到元素

1、问题描述
vue v-for循环map时可以获取到数据,但是用item.id时却获取不到数据
2、数据样例

图片说明

数据是这样的,map里面嵌套了一个子map subMenu,但是subMenu的右侧显示为Object
v-for的时候可以获取到subMenu的数据,用item.menu的时候是获取不到对应的值的。
如果不用item.menu而是直接用menu却又可以获取到。请看前端代码

<el-menu background-color="#252526" text-color="#fff" active-text-color="#ffd04b">
          <!-- 一级菜单区域 -->
          <el-submenu :index="item.menu_id + ''" v-for="item in menuList" :key="item.menu_id">
            <!-- 一级菜单模板区域 -->
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>{{item.menu}}</span>
            </template>
            <!-- 二级菜单区域 -->
            <el-menu-item :index="subItem.menu_id + ''" v-for="subItem in item.subMenu" :key="subItem.menu_id">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>{{subItem.menu}}</span>
              </template>
            </el-menu-item>
          </el-submenu>
        </el-menu>

js代码:

async getMenuList() {
      this.$http.get('/manager/getMenu').then(
        response => {
            if(response.data.code!==200) {
                return this.$message.error("左侧菜单获取失败!");
            }
            this.menuList = response.data.data;
            console.log(this.menuList);
        },
        error => {
          return this.$message.error("左侧菜单获取失败!");
        }
      );
    }

中如果为{{subItem}}则页面显示效果为

图片说明

中如果为{{subItem.menu}}则页面显示效果为

图片说明

是没有办法获取到相应的值。

各位大神们,请问这是什么原因导致的?如何解决?

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • yin_jia_521 2020-05-24 12:22
    已采纳

    subMenu 这个返回回来应该是一个集合而不是object。如果是集合那你写法是没有问题的,而且看你的应用常见这个也应该返回耳机菜单的集合才对,如果没有任何数据也该返回一个空集合。
    他object 还用了for去循环,看结果是吧object的元素给输出一遍,这个需要看下他源代码是怎么回事了。

    已采纳该答案
    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题