the scroll bar cannot scroll when it scrolls below the fixed column
< el-table: data= "tableData6" border= "show-summary style=" width: 100% >
<el-table-column prop="id" label="ID" width="180">
</el-table-column>
<el-table-column prop="name" label="">
</el-table-column>
<el-table-column prop="amount1" sortable label=" 1">
</el-table-column>
<el-table-column prop="amount2" sortable label=" 2">
</el-table-column>
<el-table-column prop="amount3" sortable label=" 3">
</el-table-column>
<el-table-column prop="amount3" sortable label=" 3">
</el-table-column>
<el-table-column prop="amount3" sortable label=" 3">
</el-table-column>
<el-table-column prop="amount3" sortable label=" 3">
</el-table-column>
<el-table-column prop="amount3" sortable label=" 3">
</el-table-column>
< / el-table >
var Main = {
data() {
return {
tableData6: [{
id: "12987122",
name: "",
amount1: "234",
amount2: "3.2",
amount3: 10
}, {
id: "12987123",
name: "",
amount1: "165",
amount2: "4.43",
amount3: 12
}, {
id: "12987124",
name: "",
amount1: "324",
amount2: "1.9",
amount3: 9
}, {
id: "12987125",
name: "",
amount1: "621",
amount2: "2.2",
amount3: 17
}, {
id: "12987126",
name: "",
amount1: "539",
amount2: "4.1",
amount3: 15
}]
};
},
methods: {
getSummaries(param) {
const { columns, data } = param;
const sums = [];
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = "";
return;
}
const values = data.map(item => Number(item[column.property]));
if (!values.every(value => isNaN(value))) {
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr);
if (!isNaN(value)) {
return prev + curr;
} else {
return prev;
}
}, 0);
sums[index] += " ";
} else {
sums[index] = "N/A";
}
});
return sums;
}
}
};
var Ctor = Vue.extend (Main)
new Ctor (). $mount ("- sharpapp")