1. 表の中に表が埋め込まれているのですが、埋め込んだ表の内容を超えるとスクロールバーが表示されますが、スクロールすると2つに分かれてしまい、ズレが生じます。
<el-table
:data="list"
stripe
border
size="small"
:height="tableHeight"
v-loading="loading"
element-loading-text="拼命加载中"
:row-key="getRowKeys"
:expand-row-keys="expands"
@expand-change="expandChange"
>
<el-table-column align="center" prop="vehPlate" label="车牌号" min-width="80"></el-table-column>
<el-table-column align="center" prop="vehPlateColorName" label="车牌颜色" min-width="60"></el-table-column>
<el-table-column fixed="right" align="center" label="操作" width="80" type="expand">
<template slot-scope="scope" v-loading.fullscreen.lock="loading">
<tableList :tableData="scope.row.child" @getListInfo="getListInfo" ></tableList>
</template>
</el-table-column>
</el-table>
// tableList的内容
<el-table
:data="list"
style="width: 98%;margin:0 auto 0;"
stripe
border
size="small"
:max-height="tableHeight">
<el-table-column align="center" prop="gantryName" label="门架名称" min-width="110"></el-table-column>
<el-table-column align="center" label="操作" width="80">
<template slot-scope="scope">
<el-button type="text"
@click="$emit('getListInfo',scope.row)"
>详情</el-button>
</template>
</el-table-column>
<el-table-column width="40" style="display: none"></el-table-column>
</el-table>
ページ画像:
このズレのサイズは固定されているようです。当初、この問題は最終列でのみ発生すると思っていましたが、最終列をこの位置より小さいサイズに設定すると、最後から 2 番目の場合にもズレが発生します。