若依的框架怎么样_基于bootstrapTable的若依框架如何获取表格选中行的整行数据?...
導(dǎo)語
項目是基于若依框架寫的,大部分的底層技術(shù)都是bootstrap。
最近在寫一個項目的時候遇見一個需求,需要將子頁面表格中選中的數(shù)據(jù)回傳給父頁面。為了減少網(wǎng)絡(luò)請求,所以就準(zhǔn)備直接使用子父頁面?zhèn)髦怠S谑俏也榭戳艘幌聄uoyi.js源碼,發(fā)現(xiàn)其中只有獲取選中的數(shù)據(jù)id值的函數(shù),并沒有獲取整行數(shù)據(jù)的函數(shù)。不過根據(jù)現(xiàn)有的函數(shù)發(fā)現(xiàn)獲取整行數(shù)據(jù)是可以實現(xiàn)的。
第一步 分析源碼
以下是獲取選中行的指定列的值的代碼,可以看見在回傳數(shù)據(jù)的時候,都標(biāo)明了指定列,所以我們只需要重寫一個函數(shù),不標(biāo)明指定列就可以實現(xiàn)想要的功能了。
selectColumns: function(column) {
//獲取當(dāng)前選中的值
var rows = $.map($("#" + table.options.id).bootstrapTable('getSelections'), function (row) {
return row[column];//傳回指定列的值
});
//如果設(shè)置了記住選中數(shù)據(jù)
if ($.common.isNotEmpty(table.options.rememberSelected) && table.options.rememberSelected) {
var selectedRows = table.rememberSelecteds[table.options.id];
if($.common.isNotEmpty(selectedRows)) {
rows = $.map(table.rememberSelecteds[table.options.id], function (row) {
return row[column];//回傳指定列的值
});
}
}
//去重
return $.common.uniqueFn(rows);
},
第二步 重寫函數(shù) 獲取選中行的整行數(shù)據(jù)
根據(jù)現(xiàn)有的函數(shù),改起來也很簡單。直接將指定列的部分刪除就好,不過值得注意的一點就是去重函數(shù)也需要重寫
selectRows:function(){
//獲取當(dāng)前選中的值
let rows = $.map($("#" + table.options.id).bootstrapTable('getSelections'), function (row) {
return row;
});
//如果設(shè)置了記住選中數(shù)據(jù)
if ($.common.isNotEmpty(table.options.rememberSelected) && table.options.rememberSelected) {
let selectedRows = table.rememberSelecteds[table.options.id];
if($.common.isNotEmpty(selectedRows)) {
rows = $.map(table.rememberSelecteds[table.options.id], function (row) {
return row;
});
}
}
//去重
return $.common.uniqueFnByRows(rows);
},
第三步 重寫去重函數(shù)
在原有的去重函數(shù)下方重寫一個新的去重函數(shù)就好
uniqueFnByRows:function(array){
var result = [];
var hashObj = {};
for (var i = 0; i < array.length; i++) {
if (!hashObj[array[i].id]) {//參數(shù)id為主鍵,請根據(jù)自己的情況進(jìn)行修改
hashObj[array[i].id] = true;
result.push(array[i]);
}
}
return result;
},
總結(jié)
以上是生活随笔為你收集整理的若依的框架怎么样_基于bootstrapTable的若依框架如何获取表格选中行的整行数据?...的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: hadoop 实战练习_Hadoop 实
- 下一篇: arm rtx教程_ARM CMSIS标