说明
这一部分是在 table
组件中用到的相关的工具。
源码解读
/**
* 获取 td 元素,即单元格
* @param event 触发的事件
* @returns {*} td 元素 或者 null
*/
export const getCell = function(event) {
let cell = event.target;
while (cell && cell.tagName.toUpperCase() !== 'HTML') {
if (cell.tagName.toUpperCase() === 'TD') {
return cell;
}
cell = cell.parentNode;
}
return null;
};
/**
* 通过 foo.bar 这种来获取对象中的属性
* @param object
* @param prop
* @returns {*}
*/
export const getValueByPath = function(object, prop) {
prop = prop || '';
const paths = prop.split('.');
let current = object;
let result = null;
for (let i = 0, j = paths.length; i < j; i++) {
const path = paths[i];
if (!current) break;
if (i === j - 1) {
result = current[path];
break;
}
current = current[path];
}
return result;
};
/**
* 判断是不是对象
* @param obj
* @returns {boolean}
*/
const isObject = function(obj) {
return obj !== null && typeof obj === 'object';
};
/**
* 排序
* @param array 要排序的数组
* @param sortKey 排序的键
* @param reverse 是否翻转
* @param sortMethod 排序的比较方法
* @returns {*}
*/
export const orderBy = function(array, sortKey, reverse, sortMethod) {
if (typeof reverse === 'string') { // 是否降序
reverse = reverse === 'descending' ? -1 : 1;
}
// 是否有排序的键
if (!sortKey) {
return array;
}
// 升序或者降序
const order = (reverse && reverse < 0) ? -1 : 1;
// 为了不修改原始数组,复制一份数组进行排序
return array.slice().sort(sortMethod ? function(a, b) {
// 如果有传入排序方法,用该方法决定顺序
return sortMethod(a, b) ? order : -order;
} : function(a, b) { // 默认方法
if (sortKey !== '$key') { // 如果不是根据 $key 排序
// 选择真正的值
if (isObject(a) && '$value' in a) a = a.$value;
if (isObject(b) && '$value' in b) b = b.$value;
}
// 获取比较要比较的值
a = isObject(a) ? getValueByPath(a, sortKey) : a;
b = isObject(b) ? getValueByPath(b, sortKey) : b;
return a === b ? 0 : a > b ? order : -order;
});
};
/**
* 通过 id 来获取列
* @param table 表格
* @param columnId 列的 id
* @returns {*}
*/
export const getColumnById = function(table, columnId) {
let column = null;
table.columns.forEach(function(item) {
if (item.id === columnId) {
column = item;
}
});
return column;
};
/**
* 根据单元格查找列
* @param table 表格
* @param cell 单元格
* @returns {*}
*/
export const getColumnByCell = function(table, cell) {
const matches = (cell.className || '').match(/el-table_[^\s]+/gm);
if (matches) {
return getColumnById(table, matches[0]);
}
return null;
};
/**
* 判断是不是 Firefox 浏览器
* @type {boolean}
*/
const isFirefox = typeof navigator !== 'undefined' && navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
/**
* 增加滚轮滚动事件
* @param element
* @param callback
*/
export const mousewheel = function(element, callback) {
if (element && element.addEventListener) {
element.addEventListener(isFirefox ? 'DOMMouseScroll' : 'mousewheel', callback);
}
};
/**
* 获取某一行的值中的某些值
* @param row 行
* @param rowKey 键名或者搜索函数
*/
export const getRowIdentity = (row, rowKey) => {
if (!row) throw new Error('row is required when get row identity');
if (typeof rowKey === 'string') {
return row[rowKey];
} else if (typeof rowKey === 'function') {
return rowKey.call(null, row);
}
};