在这个示例中,当用户点击表格中的任意一行时,都会触发 handleRowClick 方法,并传递被点击行的数据、事件对象和列对象作为参数。 2. 监听特定列的点击事件 如果你只想监听特定列的点击事件,可以使用 el-table-column 的template 插槽,并在插槽内部添加点击事件监听器。 代码示例: vue <template> <el-ta...
1. <el-table :data="projNameOrCodeMenuList" class="parentNode" @row-click="chooseParentNode"> <el-table-column class="parentNodeColumn" prop="projectName,projectCode" label="项目名称(代码)" width="300"> // 使用作用域插槽,可以获取这一行返回的数据 <template slot-scope="scope"> {{scope....
原以为prop=" "中只能放一个字段的数据,想放两个字段数据的话,要把<el-table-column></<el-table-column>标签再用<template></template>标签包裹才行如下: <el-table:data="projNameOrCodeMenuList"class="parentNode"@row-click="chooseParentNode"><el-table-columnclass="parentNodeColumn"prop="projectName...
5 在el-table-column中添加一个,重新把数据显示到div中,不然页面会没有数据显示 <template slot-scope="scope"> <div @click="detailData(scope.row)">{{ scope.row.acount }}</div> </template>
<el-table :data="tableData1" class="tb-edit" style="width: 100%" highlight-current-row @row-click="handleCurrentChange"> <div style='display: inline-block; width: 500px; height: 100px' v-if="isShow"> <el-table-column label="日期" width="100"> <template scope="scope"> <el-in...
<el-table :data="tableData1" class="tb-edit" style="width: 100%" highlight-current-row @row-click="handleCurrentChange"> <div style='display: inline-block; width: 500px; height: 100px' v-if="isShow"> <el-table-column label="日期" width="100"> <template scope="scope"> <el-in...
row-key="id" border> <el-table-column type="selection" width="55"> </el-table-column> <el-table-column prop="staffNum" label="员工号"> </el-table-column> <el-table-column prop="staffName" label="姓名"> </el-table-column> ...
el-table中渲染数据后,选中某行,点击后面修改按钮,将该行数据填入弹出的表单中 效果图: 点击"修改"按钮 数据填入弹出的修改框内 代码部分: 父组件中声明了子组件ref="addform",子组件中数据项v-model="form" 父组件html 在按钮处,增加了<template scope="scope">,并在@click时以scope.row为入参 ...
我做了一个组件,对el-table, el-pagination,列表排序和过滤做了封装。 基本el-table-column作为slot传入组件。 代码在这里 <template> sc-table(:data='tableData', :tool-bar-def='toolBarDef', :row-action-def='rowActionsDef', action-col-width='180', :col-not-row-click='["attachments"]', @...
@click="buttonClick(scope.row)" >按钮 </el-button> </template> </el-table-column> </el-table> <style lang="scss"> .record_table { .el-table__body-wrapper { overflow-x: scroll !important; // 设置横轴滚动条 } } </style>