首页 > 其他分享 >el-table单选2

el-table单选2

时间:2024-08-05 11:40:28浏览次数:15  
标签:el name 王小虎 普陀区 单选 date table 2016 05

<template>
	<el-table
		ref="singleTable"
		:data="tableData"
		tooltip-effect="dark"
		style="width: 100%"
		@select="rowSelect"
	>
		<el-table-column type="selection" width="55"> </el-table-column>
		<el-table-column label="日期" width="120">
			<template slot-scope="scope">{{ scope.row.date }}</template>
		</el-table-column>
		<el-table-column prop="name" label="姓名" width="120"> </el-table-column>
		<el-table-column prop="address" label="地址" show-overflow-tooltip>
		</el-table-column>
	</el-table>
</template>

<script>
export default {
	name: 'singleTable',
	data() {
		return {
			tableData: [
				{
					date: '2016-05-03',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				},
				{
					date: '2016-05-02',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				},
				{
					date: '2016-05-04',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				},
				{
					date: '2016-05-01',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				},
				{
					date: '2016-05-08',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				},
				{
					date: '2016-05-06',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				},
				{
					date: '2016-05-07',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				}
			],
		};
	},
	
	methods: {
		rowSelect(selection, row) {
			this.$refs.singleTable.clearSelection();
			if (selection.length == 0) return;
			this.$refs.singleTable.toggleRowSelection(row, true);
		},
		
	}
};
</script>
<style scoped lang="scss">
//隐藏全选
/deep/ .el-table-column--selection.is-leaf {
	.el-checkbox {
		display: none;
	}
}
</style>

标签:el,name,王小虎,普陀区,单选,date,table,2016,05
From: https://www.cnblogs.com/LiZiheng/p/18342907

相关文章

  • Salesforce Sales Cloud 零基础学习(五) My Labels的使用
    本篇参考:https://help.salesforce.com/s/articleView?id=sf.sales_core_record_labels.htm&type=5 在公司中,SDR以及AE每天可能需要追踪很多的Lead以及Opportunity,针对Lead/Opportunity可能每天需要和潜在客户进行多次联系,每次联系可能有一些记录的消息以及自己做一些笔记。比......
  • selenium
    第一章selenium的原理与安装1、selenium简介Selenium是一套Web网站的程序自动化的解决方案。通过它我们可以写出自动化程序,像人在浏览器中操作web页面一样。比如点击页面按钮,在文本框中输入文字等操作。而且还能从web页面获取信息。比如获取火车、汽车票务信息,招聘网站职位岗......
  • 我用AI绘画Stable Diffusion设计建筑户型图,速度又快画的又好!AI打工不惧内卷了!
    大家好,我是程序员晓晓户型图设计是地产公司的常规工作,逐个房间填色摆放家具,忙忙碌碌一天才能完成一个户型,现在用我总结的AI设计工作流程,只要5分钟!现在普通人也能从事户型图设计工作。今天我们通过一个具体的工程案例,一起使用AI绘图工具快速精通户型图设计工作流程。我们先......
  • MyBatis Plus @TableField
    @TableField是MyBatisPlus提供的一个注解,用于指定实体类字段与数据库表字段的映射关系,并可以设置字段的特殊属性。以下是@TableField的具体使用场景、用法和参数说明:使用场景字段名映射:当实体类的字段名与数据库表的字段名不一致时,可以使用@TableField注解进行映......
  • Stable Diffusion AI 4.8.7软件安装包下载及安装教程
    软件下载1.软件名称:StableDiffusionAI2.软件版本:4.8.73.软件大小:16.52GB4.安装环境:win7/win10/win11(64位)5.百度网盘下载地址:提示:建议先转存后下载,主页可获取更多行业软件和办公黑科技及素材等!软件介绍StableDiffusionAI是一款先进的以文本生成图像的AI工具,能......
  • 【高录用!Fellow 主讲!SPIE独立出版 | 往届均已EI检索】第四届先进算法与神经网络国际学
    第四届先进算法与神经网络国际学术会议(AANN2024)由中国石油大学(华东)及山东省可信人工智能生态数据开放创新应用实验室联合主办,会议将于2024年8月9-11日在中国·青岛召开。AANN2024将围绕“先进算法与神经网络”的最新研究领域,为来自国内外高等院校、科学研究所、企事业......
  • el-slider实现一个能拖动的时间范围选择器
    el-slider实现一个能拖动的时间范围选择器<template><divstyle="width:200px"><el-sliderv-model="workTime":step="5":max="1435":marks="marks":format-tooltip="f......
  • el-date-picker周选择器获取选择的日期范围
    el-date-picker周选择器获取选择的日期范围<el-date-pickerv-model="formData.date"type="week"format="yyyy第WW周"placeholder="选择周"@change="weekChange"&......
  • el-date-picker月选择器获取选择的日期范围
    el-date-picker月选择器获取选择的日期范围<el-date-pickerv-model="monthValue"type="month"placeholder="选择月"value-format="yyyy-MM-dd"@change="monthChange"......
  • el-date-picker切换的坑
    el-date-picker日期组件切换的坑问题描述:问题1.根据类型切换需要的时间选择器组件(搜索栏是一个form组件,里面有input、select、picker等,在使用的页面里传入指定的类型就能展示)第一次按顺序切换日常发,周常发,月常发是没问题的,但是当第二次选择周常发时,选择器无变化,然后再一次切......