diff --git a/examples/routers/table.vue b/examples/routers/table.vue index 42247dd..0dc7340 100644 --- a/examples/routers/table.vue +++ b/examples/routers/table.vue @@ -1,7 +1,7 @@ <template> <div> - <Table border :context="self" :columns="columns7" :data="data6"></Table> - <abc></abc> + <Table border :columns="columns7" :data="data6"></Table> + <Button @click="handleAdd"> + 1</Button> </div> </template> <script> @@ -10,13 +10,23 @@ components: { abc }, data () { return { - self: this, + data1: 1, +// self: this, columns7: [ { title: '姓名', key: 'name', - render (row, column, index) { - return `<abc></abc>`; +// render (row, column, index) { +// return `<abc></abc>`; +// } + render: (h, row, column, index) => { + return h('div', [ + h('Button',{ + on: { + click: this.handleClick + } + }, 'hello') + ]) } }, { @@ -61,6 +71,11 @@ ] } }, + computed: { + ttt () { + return this.data1 + 1; + } + }, methods: { show (index) { this.$Modal.info({ @@ -70,6 +85,12 @@ }, remove (index) { this.data6.splice(index, 1); + }, + handleAdd () { + this.data1++; + }, + handleClick () { + this.$Message.info('111') } } } diff --git a/src/components/table/cell.vue b/src/components/table/cell.vue index 94bcfb4..d731a79 100644 --- a/src/components/table/cell.vue +++ b/src/components/table/cell.vue @@ -48,42 +48,59 @@ methods: { compile () { if (this.column.render) { - const $parent = this.context; - const template = this.column.render(this.row, this.column, this.index); - const cell = document.createElement('div'); - cell.innerHTML = template; + // 兼容真 Render,后期废弃旧用法 + let isRealRender = false; + try { + this.column.render(this.row, this.column, this.index); + } + catch (err) { + isRealRender = true; + } - 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); - // todo 临时解决方案 + if (isRealRender) { + const component = new Vue({ + render: (h) => { + return this.column.render(h, this.row, this.column, 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; - // 获取父组件使用的局部 component - const components = {}; - Object.getOwnPropertyNames($parent.$options.components).forEach(item => { - components[item] = $parent.$options.components[item]; - }); + 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 - }); - component.row = this.row; - component.column = this.column; + const component = new Vue({ + render: res.render, + staticRenderFns: res.staticRenderFns, + methods: methods, + data () { + return $parent._data; + }, + components: components + }); + component.row = this.row; + component.column = this.column; - const Cell = component.$mount(); - this.$refs.cell.appendChild(Cell.$el); + const Cell = component.$mount(); + this.$refs.cell.appendChild(Cell.$el); + } } }, destroy () { -- libgit2 0.21.4