diff --git a/examples/routers/table.vue b/examples/routers/table.vue
index 5f34c8a..e4a0191 100644
--- a/examples/routers/table.vue
+++ b/examples/routers/table.vue
@@ -11,6 +11,7 @@
{
type: 'expand',
render: (h) => {
+ console.log('______hover______');
return h(etable);
},
width: 50
diff --git a/src/components/table/cell.vue b/src/components/table/cell.vue
index bfcaaac..0b8d853 100644
--- a/src/components/table/cell.vue
+++ b/src/components/table/cell.vue
@@ -19,11 +19,9 @@
</div>
</template>
<script>
- import Vue from 'vue';
import Cell from './expand';
import Icon from '../icon/icon.vue';
import Checkbox from '../checkbox/checkbox.vue';
- import { findComponentUpward } from '../../utils/assist';
export default {
name: 'TableCell',
@@ -46,7 +44,7 @@
return {
renderType: '',
uid: -1,
- context: this.$parent.$parent.currentContext
+ context: this.$parent.$parent.$parent.currentContext
};
},
computed: {
@@ -70,76 +68,11 @@
}
},
methods: {
- compile () {
- if (this.column.render && this.renderType === 'render') {
- // todo 兼容真 Render，后期废弃旧用法
- let isRealRender = true;
- const Table = findComponentUpward(this, 'Table');
- if (Table.context) isRealRender = false;
-
- if (isRealRender) {
-// this.$el.innerHTML = '';
-// const component = new Vue({
-// functional: true,
-// render: (h) => {
-// return this.column.render(h, {
-// row: this.row,
-// column: this.column,
-// index: this.index
-// });
-// }
-// });
-// const Cell = component.$mount();
-// this.$refs.cell.appendChild(Cell.$el);
- } else {
- const $parent = this.context;
- const template = this.column.render(this.row, this.column, this.index);
- const cell = document.createElement('div');
- cell.innerHTML = template;
-
- this.$el.innerHTML = '';
- let methods = {};
- Object.keys($parent).forEach(key => {
- const func = $parent[key];
- if (typeof(func) === 'function' && (func.name === 'boundFn' || func.name === 'n')) {
- methods[key] = func;
- }
- });
- const res = Vue.compile(cell.outerHTML);
- // 获取父组件使用的局部 component
- const components = {};
- Object.getOwnPropertyNames($parent.$options.components).forEach(item => {
- components[item] = $parent.$options.components[item];
- });
-
- const component = new Vue({
- render: res.render,
- staticRenderFns: res.staticRenderFns,
- methods: methods,
- data () {
- return $parent._data;
- },
- components: components
- });
- if ($parent.$store != undefined) {
- component.$store = $parent.$store;
- }
- component.row = this.row;
- component.column = this.column;
-
- const Cell = component.$mount();
- this.$refs.cell.appendChild(Cell.$el);
- }
- }
- },
- destroy () {
-
- },
toggleSelect () {
- this.$parent.$parent.toggleSelect(this.index);
+ this.$parent.$parent.$parent.toggleSelect(this.index);
},
toggleExpand () {
- this.$parent.$parent.toggleExpand(this.index);
+ this.$parent.$parent.$parent.toggleExpand(this.index);
}
},
created () {
@@ -154,20 +87,6 @@
} else {
this.renderType = 'normal';
}
- },
- mounted () {
- this.$nextTick(() => {
- this.compile();
- });
- },
- beforeDestroy () {
- this.destroy();
- },
- watch: {
- naturalIndex () {
- this.destroy();
- this.compile();
- }
}
};
</script>
diff --git a/src/components/table/table-body.vue b/src/components/table/table-body.vue
index 5aeb901..a374624 100644
--- a/src/components/table/table-body.vue
+++ b/src/components/table/table-body.vue
@@ -5,12 +5,13 @@
</colgroup>
<tbody :class="[prefixCls + '-tbody']">
<template v-for="(row, index) in data">
- <tr
- :class="rowClasses(row._index)"
- @mouseenter.stop="handleMouseIn(row._index)"
- @mouseleave.stop="handleMouseOut(row._index)"
- @click.stop="clickCurrentRow(row._index)"
- @dblclick.stop="dblclickCurrentRow(row._index)">
+ <table-tr
+ :row="row"
+ :prefix-cls="prefixCls"
+ @mouseenter.native.stop="handleMouseIn(row._index)"
+ @mouseleave.native.stop="handleMouseOut(row._index)"
+ @click.native.stop="clickCurrentRow(row._index)"
+ @dblclick.native.stop="dblclickCurrentRow(row._index)">
<td v-for="column in columns" :class="alignCls(column, row)">
<Cell
:fixed="fixed"
@@ -25,7 +26,7 @@
:expanded="rowExpanded(row._index)"
></Cell>
</td>
- </tr>
+ </table-tr>
<tr v-if="rowExpanded(row._index)">
<td :colspan="columns.length" :class="prefixCls + '-expanded-cell'">
<Expand :key="row" :row="row" :render="expandRender" :index="row._index"></Expand>
@@ -37,6 +38,7 @@
</template>
<script>
// todo :key="row"
+ import TableTr from './table-tr.vue';
import Cell from './cell.vue';
import Expand from './expand.js';
import Mixin from './mixin';
@@ -44,7 +46,7 @@
export default {
name: 'TableBody',
mixins: [ Mixin ],
- components: { Cell, Expand },
+ components: { Cell, Expand, TableTr },
props: {
prefixCls: String,
styleObject: Object,
@@ -72,16 +74,6 @@
}
},
methods: {
- rowClasses (_index) {
- return [
- `${this.prefixCls}-row`,
- this.rowClsName(_index),
- {
- [`${this.prefixCls}-row-highlight`]: this.objData[_index] && this.objData[_index]._isHighlight,
- [`${this.prefixCls}-row-hover`]: this.objData[_index] && this.objData[_index]._isHover
- }
- ];
- },
rowChecked (_index) {
return this.objData[_index] && this.objData[_index]._isChecked;
},
@@ -91,9 +83,6 @@
rowExpanded(_index){
return this.objData[_index] && this.objData[_index]._isExpanded;
},
- rowClsName (_index) {
- return this.$parent.rowClassName(this.objData[_index], _index);
- },
handleMouseIn (_index) {
this.$parent.handleMouseIn(_index);
},
diff --git a/src/components/table/table-tr.vue b/src/components/table/table-tr.vue
new file mode 100644
index 0000000..6fb1bfd
--- /dev/null
+++ b/src/components/table/table-tr.vue
@@ -0,0 +1,31 @@
+<template>
+ <tr :class="rowClasses(row._index)"><slot></slot></tr>
+</template>
+<script>
+ export default {
+ props: {
+ row: Object,
+ prefixCls: String
+ },
+ computed: {
+ objData () {
+ return this.$parent.objData;
+ }
+ },
+ methods: {
+ rowClasses (_index) {
+ return [
+ `${this.prefixCls}-row`,
+ this.rowClsName(_index),
+ {
+ [`${this.prefixCls}-row-highlight`]: this.objData[_index] && this.objData[_index]._isHighlight,
+ [`${this.prefixCls}-row-hover`]: this.objData[_index] && this.objData[_index]._isHover
+ }
+ ];
+ },
+ rowClsName (_index) {
+ return this.$parent.$parent.rowClassName(this.objData[_index], _index);
+ },
+ }
+ };
+</script>
\ No newline at end of file
--
libgit2 0.21.4