使用element ui
组件,将table
组件和pagnation
组件合并成一个.vue
文件webpack编译过程中出错了
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.
查了资料是不能有两个根节点,我尝试用div将分页包裹起来还是没效果
ERROR in ./~/[email protected]@vue-loader/lib/template-compiler?{"id":"data-v-808aabae"}!./~/[email protected]@vue-loader/lib/selector.js?type=template&index=0!./application/views/assets/js/components/TableCompany.vue
(Emitted value instead of an instance of Error)
Error compiling template:
<el-table
ref="multipleTable"
:data="tableData"
border
style="width: 100%"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
prop="company_name"
label="单位名称"
width="180">
</el-table-column>
<el-table-column
prop="company_user"
label="联系人"
width="80">
<template scope="scope">
<el-popover trigger="hover" placement="top">
<p>地区: { scope.row.company_local}</p>
<p>地址: { scope.row.tax_number }</p>
<p>业务员: { scope.row.company_address}</p>
<p>所属地区: { scope.row.company_address}</p>
<div slot="reference" class="name-wrapper">
<el-tag>{ scope.row.company_user }</el-tag>
</div>
</el-popover>
</template>
</el-table-column>
<el-table-column
prop="tax_four_cell"
label="国税类型"
width="120">
</el-table-column>
<el-table-column
prop="seller_user"
label="所得税类型"
width="120">
</el-table-column>
<el-table-column
prop="company_address"
label="地址"
:formatter="formatter">
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[1, 2, 3, 4]"
:page-size="2"
layout="total, sizes, prev, pager, next, jumper"
:total="totalCount">
</el-pagination>
- 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.
@ ./application/views/assets/js/components/TableCompany.vue 5:2-241
@ ./application/views/assets/js/main.js