做vue项目的时候,向template模板添加元素的时候报错
Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead.
刚开始我是这样写的
1 <template> 2 <div class="reconmmend-title">热销推荐</div> 3 <ul> 4 <li class="item"> 5 <div class="item-img-wrapper"> 6 <img class="item-img" src="" alt=""> 7 </div> 8 <div class="item-info"> 9 <p></p> 10 <p></p> 11 </div> 12 </li> 13 </ul> 14 </template>
搜了一下这句报错的解释是:组件模板应正好包含一个根元素。如果在多个元素上使用v-if,请改用v-else-if链接它们。
原来vue组件只能包含一个根元素,要i想写多个得把他们包含在一个根元素里面,调整后代码如下:
1 <template> 2 <div> 3 <div class="reconmmend-title">热销推荐</div> 4 <ul> 5 <li class="item"> 6 <div class="item-img-wrapper"> 7 <img class="item-img" src="" alt=""> 8 </div> 9 <div class="item-info"> 10 <p></p> 11 <p></p> 12 </div> 13 </li> 14 </ul> 15 </div> 16 </template>