From b827701dec6e3102f1d759840f937068a0c57a87 Mon Sep 17 00:00:00 2001 From: Julyp Date: Mon, 3 Feb 2020 14:06:31 +0800 Subject: [PATCH] =?UTF-8?q?--=20=E4=BC=98=E5=8C=96querySelector?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lib/core/core.js | 21 ++++++++------------- lib/core/fixed.js | 2 +- lib/core/utils.js | 11 ++++++++--- 3 files changed, 17 insertions(+), 17 deletions(-) diff --git a/lib/core/core.js b/lib/core/core.js index 96217af..92129c5 100644 --- a/lib/core/core.js +++ b/lib/core/core.js @@ -1,6 +1,5 @@ import sort from './vdom'; import { - cloneNode, appendChild, appendChildren, removeChild, @@ -20,7 +19,6 @@ import { } from './utils'; import scrollBarWidth from './scrollbar-width'; - export default function initMixin(Table) { Table.prototype._init = function(options = {}) { if (!options.selector) { @@ -34,7 +32,6 @@ export default function initMixin(Table) { if (!table) return; vm.gutterWidth = scrollBarWidth(); - root.classList.add("smart-table"); options.size && root.classList.add("smart-table-custom-" + options.size) @@ -55,7 +52,7 @@ export default function initMixin(Table) { const theadHeight = thead.offsetHeight; const tableHeight = table.offsetHeight; let customHeight = options.height; - customHeight = (typeof customHeight === 'function' ? customHeight() : customHeight) || tableHeight; + customHeight = (typeof customHeight === 'function' ? customHeight.call() : customHeight) || tableHeight; customHeight = customHeight > theadHeight ? customHeight : (theadHeight + 100); //获取table宽高 vm.size = { @@ -81,10 +78,10 @@ export default function initMixin(Table) { //初始化fixed元素及宽度 initFixed(thead, vm); //初始化table 拆分table的thead和tbody - vm.$theadWrapper = createTabelWrapper("smart-table_header-wrapper", vm, "header", thead); + vm.$theadWrapper = createTabelWrapper("smart-table_header-wrapper", vm, "header", thead, vm.scrollY); vm.$tbodyWrapper = createTabelWrapper("smart-table_body-wrapper", vm, "body", tbody); - appendChildren(root, [vm.$theadWrapper, vm.$tbodyWrapper]) + appendChildren(root, [vm.$theadWrapper, vm.$tbodyWrapper]); vm.size.theadHeight = thead.offsetHeight; vm.size.tbodyHeight = customHeight - thead.offsetHeight; @@ -92,7 +89,7 @@ export default function initMixin(Table) { //删除空余的table节点 removeChild(table.parentNode, table); - createFixed(vm, thead, tbody) + createFixed(vm, thead, tbody); //获取tbody的data数据 vm.data = initData(vm, tbody); @@ -116,8 +113,7 @@ function layout() { function getColgroup(thead, tbody, theadLength) { let arr = []; if (theadLength === 1) { - //单行 - querySelectorAll(querySelector(thead, "tr"), "th").forEach(column => { + querySelectorAll(thead, "tr:first-child>th").forEach(column => { let width = getIntByAttr(column, "width", 0); if (width === 0) { width = column.offsetWidth > 80 ? column.offsetWidth : 80; @@ -125,8 +121,7 @@ function getColgroup(thead, tbody, theadLength) { arr.push(width) }) } else { - //多行 - querySelectorAll(querySelector(tbody, "tr"), "td").forEach(column => { + querySelectorAll(tbody, "tr:first-child>td").forEach(column => { let width = column.offsetWidth; if (width < 50) { width = width + 10; @@ -154,7 +149,7 @@ function replaceFixedColGroup(vm, selector, newTableWidth) { let fixedBody = querySelector(selector, '.smart-table_body'); replaceColGroup(vm, fixedHeader); replaceColGroup(vm, fixedBody); - const columns = querySelectorAll(querySelector(selector, "tr"), "th"); + const columns = querySelectorAll(selector, "tr:first-child>th"); let fixedWrapperWidth = 0; columns.forEach((item, index) => { if (item.className != 'is-hidden') fixedWrapperWidth += vm.colgroup[index] @@ -310,7 +305,7 @@ function initFixed(thead, vm) { tbody: [], width: 0 }; - const columns = querySelectorAll(querySelector(thead, "tr"), "th"); + const columns = querySelectorAll(thead, "tr:first-child>th"); const len = columns.length; let lastLeftIndex = 0; if (len !== 0) { diff --git a/lib/core/fixed.js b/lib/core/fixed.js index 8e66d82..4dfee37 100644 --- a/lib/core/fixed.js +++ b/lib/core/fixed.js @@ -43,7 +43,7 @@ export default function(vm, theadModel, tbodyModel) { function createHeaderWrapper(vm, model, meta) { let thead = cloneNode(model, true); - querySelectorAll(querySelector(thead, "tr"), "th").forEach((column, index) => { + querySelectorAll(thead, "tr:first-child>th").forEach((column, index) => { if (meta.thead.indexOf("field-" + index) === -1) { column.classList.add('is-hidden') } diff --git a/lib/core/utils.js b/lib/core/utils.js index ee6d455..fb9ea5a 100644 --- a/lib/core/utils.js +++ b/lib/core/utils.js @@ -15,11 +15,11 @@ export function refactorCell(cell) { appendChild(cell, wrapper) } -export function createTabelWrapper(className, vm, type, content) { +export function createTabelWrapper(className, vm, type, content, hasGutter) { let wrapper = createElement("div", className); let table = createElement("table", "smart-table_" + type); table.style.width = (vm.size.tabelWidth - 1) + "px"; - appendChildren(table, [createColgroup(vm.colgroup), content]) + appendChildren(table, [createColgroup(vm.colgroup, vm.gutterWidth, hasGutter), content]) appendChild(wrapper, table) return wrapper; } @@ -78,7 +78,7 @@ export function debounce(delay, callback) { } } -function createColgroup(arr) { +function createColgroup(arr, gutterWidth, hasGutter) { if (!arr) return; let colgroup = createElement("colgroup"); arr.forEach(item => { @@ -86,5 +86,10 @@ function createColgroup(arr) { col.setAttribute("width", item); appendChild(colgroup, col) }) + if (hasGutter) { + let col = createElement("col"); + col.setAttribute("width", gutterWidth) + appendChild(colgroup, col) + } return colgroup; } \ No newline at end of file