您现在的位置是:网站首页> 编程资料编程资料
element table 表格控件实现单选功能_vue.js_
2023-05-24
351人已围观
简介 element table 表格控件实现单选功能_vue.js_
项目中实现 table 表格控件单选功能,如图:

基本代码如下:
1、template 代码中:
注意:
这里写   的目的是为了页面不显示内容,只显示单选操作
2、data 代码中:
data() { return { templateSelection: '', // 返回数据 tableData: [ { 'id': 1, 'title': '嘿嘿嘿', 'priority': '高', 'state': 1, 'dealingPeople': '小龙女' }, { 'id': 2, 'title': '嘻嘻嘻', 'priority': '中', 'state': 2, 'dealingPeople': '小龙女' }, { 'id': 3, 'title': '哈哈哈', 'priority': '低', 'state': 3, 'dealingPeople': '小龙女' }, { 'id': 3, 'title': '哈哈哈', 'priority': '低', 'state': 3, 'dealingPeople': '小龙女' }, { 'id': 3, 'title': '哈哈哈', 'priority': '低', 'state': 3, 'dealingPeople': '小龙女' }, { 'id': 3, 'title': '哈哈哈', 'priority': '低', 'state': 3, 'dealingPeople': '小龙女' } ] } }3、methods 代码中:
singleElection (row) { this.templateSelection = this.tableData.indexOf(row); this.templateRadio = row.id; },到此这篇关于element table 表格控件实现单选功能的文章就介绍到这了,更多相关element table 表格单选内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!
您可能感兴趣的文章:
相关内容
- JavaScript实现一键复制内容剪贴板_JavaScript_
- 从原生JavaScript到React深入理解_JavaScript_
- 关于Element-ui中el-table出现的表格错位问题解决_vue.js_
- vue-router传参的4种方式超详细讲解_vue.js_
- vue-json-editor json编辑器的使用_vue.js_
- Vue调试工具vue-devtools的安装与使用_vue.js_
- VUE使用vue create命令创建vue2.0项目的全过程_vue.js_
- npm install编译时报"Cannot read properties of null (reading ‘pickAlgorithm‘)"错误的解决办法_node.js_
- 解决threeJS加载obj gltf模型后颜色太暗的方法_vue.js_
- JS前端监控采集用户行为的N种姿势_JavaScript_
