element-ui 表格合并

最新推荐文章于 2024-08-22 17:39:07 发布

wdcc.fade

最新推荐文章于 2024-08-22 17:39:07 发布

阅读量723

点赞数

文章标签： vue.js javascript es6

本文链接：https://blog.csdn.net/qq_45915537/article/details/108407161

版权

本文详细探讨了如何使用elementUI的span-method属性实现表格的行和列合并，通过实例展示了在vue.js项目中应用这一功能的方法。

摘要由CSDN通过智能技术生成

elementUI 表格合并

elementUI官方文档的表格合并方法为 span-method

	// Table 组件 绑定 span-method
      <Table :data="tableData"  :span-method="cellMerge" >

	data(){
		
		return  {
			spanArr: [],
			pos: 0,
			tableData:[
				{game_id: 2,game_name: "王者荣耀", scene_id: "2-32-1"）}，
				{game_id: 2,game_name: "王者荣耀", scene_id: "2-32-1"）},
				{game_id: 3,game_name: "和平精英", scene_id: "2-32-1"）}，
				{game_id: 4,game_name: "地下城与勇士", scene_id: "2-32-1"）},
				{game_id: 5,game_name: "黎明觉醒", scene_id: "2-32-1"）}，
				{game_id: 5,game_name: "黎明觉醒", scene_id: "2-32-1"）},
			]
		}
	},

	watch：{
		tableData(val){
			this.getSpanArr(val)   //监控tableData 的变化 实时更新合并结果
		}
	}

	methods:{
	
		cellMerge({ row, column, rowIndex, columnIndex }) {
		
			//  指定合并表格从那一列开始 columnIndex