Home>Article>Web Front-end> Introduction to the method of embedding check boxes and radio buttons in Element tables (code example)
This article brings you an introduction to the method of embedding check boxes and radio buttons in Element tables (code examples). It has certain reference value. Friends in need can refer to it. I hope it will be useful to you. helped.
2. Element combined with checkBox achieves the single selection effect as follows:
##html code:
js code:shopInfo
// 单选方法,返回选中的表格行 // 添加一个多选框,控制选中与否 {{ scope.row.date }}
export default { name: 'shopInfo', data () { return { tableData3: [] } }, created () { this.setTable() }, methods: { setTable () { let resdata = [{ id: 44, date: '2016-05-03', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄' }, { id: 89, date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄' }, { id: 23, date: '2016-05-04', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄' }, { id: 88, date: '2016-05-07', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄' }] // 后台数据返回后,手动添加一个checked属性控制选中与否 resdata.forEach(item => { item.checked = false }) this.tableData3 = resdata }, handleSelectionChange (row) { this.tableData3.forEach(item => { // 排他,每次选择时把其他选项都清除 if (item.id !== row.id) { item.checked = false } }) console.log(row) } } }
The above is the detailed content of Introduction to the method of embedding check boxes and radio buttons in Element tables (code example). For more information, please follow other related articles on the PHP Chinese website!