-- 优化querySelector

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) {

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')
     }

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;
 }