本文主要是介绍vue element ui table组件列宽可以拖拽调整大小,某一列可以禁止拖拽调整大小,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
只需要在 el-table-column
标签中添加:resizable="false"
即可
<template><div class="m-other-table-wrap"><el-table:data="tableData"borderstyle="width: 100%"@header-dragend="handleHeaderDragend"><el-table-column prop="date" label="日期" width="180" :resizable="false"></el-table-column><el-table-column prop="name" label="姓名" width="180"> </el-table-column><el-table-column prop="address" label="地址"> </el-table-column></el-table></div>
</template><script>
import './index.css'export default {data() {return {tableData: [{date: '2016-05-02',name: '王小虎',address: '上海市普陀区金沙江路 1518 弄',},{date: '2016-05-04',name: '王小虎',address: '上海市普陀区金沙江路 1517 弄',},{date: '2016-05-01',name: '王小虎',address: '上海市普陀区金沙江路 1519 弄',},{date: '2016-05-03',name: '王小虎',address: '上海市普陀区金沙江路 1516 弄',},],}},methods: {handleHeaderDragend(e) {console.log(e)},},
}
</script><style></style>
参考链接:
https://chat.xutongbao.top/
这篇关于vue element ui table组件列宽可以拖拽调整大小,某一列可以禁止拖拽调整大小的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!