背景:
在使用VUE添加标签的时候编译报错,报错如下:
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 <el-form ref="form" :model="form" label-width="80px"> 3 <el-form-item label="活动名称" required> 4 <el-input v-model="form.name"></el-input> 5 </el-form-item> 6 </el-form> 7 8 <el-tabs v-model="Page" type="border-card" @tab-click="handleClick"> 9 <el-tab-pane label="标签1" name="first"> 10 </el-tab-pane> 11 <el-tab-pane label="标签2" name="second"> 12 </el-tab-pane> 13 </el-tabs> 14 </template> 15 <script> 16 export default { 17 data() { 18 return { 19 cargoPage: 'first', 20 form: { 21 name: '123', 22 23 } 24 }; 25 }, 26 methods: { 27 handleClick(tab, event) { 28 } 29 } 30 }; 31 </script>
解决:
加一个<template>后加一个<div></div> 标签,问题解决
1 <template> 2 <div> 3 <el-form ······ 4 <el-tabs ······ 5 </div> 6 <template>