javascript - VueJS如何实现对多层对象的列表渲染
PHP中文网
PHP中文网 2017-04-11 10:40:01
[JavaScript讨论组]
PHP中文网
PHP中文网

认证0级讲师

全部回复(2)
迷茫

在v-for遍历对象的时候,会有一个$key变量。用你的数据写了一下,HTML部分应该是这样的:

<ul>
  <template v-for="_obj in myObj">
    <li>{{ $key }}</li>
    <ul>
      <template v-for="__obj in _obj">
        <li>{{ $key }}</li>
        <ul>
          <template v-for="value in __obj">
            <li>{{ $key }}</li>
            <ul>
              <li>{{ value }}</li>
            </ul>
          </template>
        </ul>
      </template>
    </ul>
  </template>
</ul>

这样写可以实现,但是不推荐。最好是把对象处理成合适的数组以后再遍历。

天蓬老师

建议数据最多二层,太多层逻辑乱,容易出错
可以在拿到data的时候,处理一下data,整理为最多两层的data,然后再给到vuejs

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号