javascript - 如何解决模板中v-for不能绑定在root元素上的问题

Question

<ul class="list-group" v-for="obj in titles">
      <li class="list-group-item">
          <router-link :to="obj.routerObj ? obj.routerObj : {}">{{obj.title}}</router-link>
      </li>
</ul>

比如我在一模板中想生成一个包含li元素的ul元素。
但是不能在root元素上使用v-for，我就不得不用一个p将他们包裹起来，这样在p中就生成了三个ul，每个ul元素只包含了一个li元素。视觉上没什么不同，但是初衷不一样。
请问有没有什么好的解决方法？

Answer 1

给li加v-for后可以根据不同的需求进行判断来实现li中的组件。原则上根元素就应该是唯一的吧，相当于web页面的html元素。

Answer 2

这样就只能外面嵌套一个p做根元素，根元素肯定只能有一个。

Answer 3

谢邀。用组件可以吗？你这个需求是应该dom上的需要？还是样式上的需要？还是哪里的需要？