From 4817e116e5d8e6db0cdbd9c317c5e477ea746805 Mon Sep 17 00:00:00 2001
From: "qingwei.li" <cinwell.li@gmail.com>
Date: Wed, 28 Dec 2016 18:11:25 +0800
Subject: [PATCH] Table: expand row feature only supports scoped slot.

---
 examples/docs/en-US/table.md       | 16 ++++++++--------
 examples/docs/zh-CN/table.md       | 16 ++++++++--------
 package.json                       |  2 +-
 packages/table/src/table-body.js   |  2 +-
 packages/table/src/table-column.js | 17 ++++-------------
 test/unit/specs/table.spec.js      |  6 ++++--
 6 files changed, 26 insertions(+), 33 deletions(-)

diff --git a/examples/docs/en-US/table.md b/examples/docs/en-US/table.md
index 7f7a4e5f6..36e808ef7 100644
--- a/examples/docs/en-US/table.md
+++ b/examples/docs/en-US/table.md
@@ -1349,19 +1349,19 @@ Customize table column so it can be integrated with other components.
 ### Expandable row
 
 When the row content is too long and you do not want to display the horizontal scroll bar, you can use the expandable row feature.
-:::demo Activate expandable row by adding type="expand" and `inline-template` attribute，The template for `el-table-column` will be rendered as the contents of the expanded row, you can access the same attributes as the` inline-template`。
+:::demo Activate expandable row by adding type="expand" and `Scoped slot`, The template for `el-table-column` will be rendered as the contents of the expanded row, you can access the same attributes as the` Scoped slot`.
 ```html
 <template>
   <el-table
     :data="tableData3"
     style="width: 100%">
-    <el-table-column type="expand" inline-template>
-      <div>
-      <p>State: {{ row.state }}</p>
-      <p>City: {{ row.city }}</p>
-      <p>Address: {{ row.address }}</p>
-      <p>Zip: {{ row.zip }}</p>
-      </div>
+    <el-table-column type="expand">
+      <template scope="props">
+        <p>State: {{ props.row.state }}</p>
+        <p>City: {{ props.row.city }}</p>
+        <p>Address: {{ props.row.address }}</p>
+        <p>Zip: {{ props.row.zip }}</p>
+      </template>
     </el-table-column>
     <el-table-column
       label="Date"
diff --git a/examples/docs/zh-CN/table.md b/examples/docs/zh-CN/table.md
index 0e1acd305..c8c987fb8 100644
--- a/examples/docs/zh-CN/table.md
+++ b/examples/docs/zh-CN/table.md
@@ -1363,19 +1363,19 @@
 ### 展开行
 
 当行内容过多并且不想显示横向滚动条时，可以使用 Table 展开行功能。
-:::demo 通过设置 type="expand" 和 `inline-template` 属性可以开启展开行功能，`el-table-column` 的模板会被渲染成为展开行的内容，展开行可访问的属性与使用 `inline-template` 的时候相同。
+:::demo 通过设置 type="expand" 和 `Scoped slot` 可以开启展开行功能，`el-table-column` 的模板会被渲染成为展开行的内容，展开行可访问的属性与使用 `Scoped slot` 的时候相同。
 ```html
 <template>
   <el-table
     :data="tableData3"
     style="width: 100%">
-    <el-table-column type="expand" inline-template>
-      <div>
-      <p>省: {{ row.province }}</p>
-      <p>市: {{ row.city }}</p>
-      <p>住址: {{ row.detailAddress }}</p>
-      <p>邮编: {{ row.zip }}</p>
-      </div>
+    <el-table-column type="expand">
+      <template scope="props">
+        <p>省: {{ props.row.province }}</p>
+        <p>市: {{ props.row.city }}</p>
+        <p>住址: {{ props.row.detailAddress }}</p>
+        <p>邮编: {{ props.row.zip }}</p>
+      </template>
     </el-table-column>
     <el-table-column
       label="日期"
diff --git a/package.json b/package.json
index 377a9eb2d..57e71c68b 100644
--- a/package.json
+++ b/package.json
@@ -24,7 +24,7 @@
     "lint": "eslint src/**/* test/**/* packages/**/*.{js,vue} build/**/* --quiet",
     "pub": "npm run bootstrap && sh build/git-release.sh && sh build/release.sh",
     "pub:all": "npm run dist:all && lerna publish",
-    "test": "npm run lint && CI_ENV=/dev/ karma start test/unit/karma.conf.js --single-run",
+    "test": "npm run lint && cross-env CI_ENV=/dev/ karma start test/unit/karma.conf.js --single-run",
     "test:watch": "karma start test/unit/karma.conf.js"
   },
   "repository": {
diff --git a/packages/table/src/table-body.js b/packages/table/src/table-body.js
index 4b028e413..73a001141 100644
--- a/packages/table/src/table-body.js
+++ b/packages/table/src/table-body.js
@@ -66,7 +66,7 @@ export default {
                 this.store.states.expandRows.indexOf(row) > -1
                 ? (<tr>
                     <td colspan={ this.columns.length } class="el-table__expanded-cell">
-                      { this.$parent.renderExpanded ? this.$parent.renderExpanded.call(this._renderProxy, h, { row, $index, store: this.store, _self: this.$parent.$vnode.context }) : ''}
+                      { this.table.renderExpanded ? this.table.renderExpanded(h, { row, $index, store: this.store }) : ''}
                     </td>
                   </tr>)
                 : ''
diff --git a/packages/table/src/table-column.js b/packages/table/src/table-column.js
index 82dddd9d9..c618d0e0e 100644
--- a/packages/table/src/table-column.js
+++ b/packages/table/src/table-column.js
@@ -247,19 +247,9 @@ export default {
 
     if (type === 'expand') {
       owner.renderExpanded = function(h, data) {
-        if (_self.$vnode.data.inlineTemplate) {
-          data._self = _self.context || data._self;
-          if (Object.prototype.toString.call(data._self) === '[object Object]') {
-            for (let prop in data._self) {
-              if (!data.hasOwnProperty(prop)) {
-                data[prop] = data._self[prop];
-              }
-            }
-          }
-          data._staticTrees = _self._staticTrees;
-          data.$options.staticRenderFns = _self.$options.staticRenderFns;
-          return _self.customRender.call(data);
-        }
+        return _self.$scopedSlots.default
+          ? _self.$scopedSlots.default(data)
+          : _self.$slots.default;
       };
 
       column.renderCell = function(h, data) {
@@ -270,6 +260,7 @@ export default {
     }
 
     column.renderCell = function(h, data) {
+      // 未来版本移除
       if (_self.$vnode.data.inlineTemplate) {
         renderCell = function() {
           data._self = _self.context || data._self;
diff --git a/test/unit/specs/table.spec.js b/test/unit/specs/table.spec.js
index 23525ea9e..e983018f9 100644
--- a/test/unit/specs/table.spec.js
+++ b/test/unit/specs/table.spec.js
@@ -965,8 +965,10 @@ describe('Table', () => {
           return createVue({
             template: `
             <el-table row-key="id" :data="testData" @expand="handleExpand" ${extra}>
-              <el-table-column type="expand" inline-template>
-                <div>{{row.name}}</div>
+              <el-table-column type="expand">
+                <template scope="props">
+                  <div>{{props.row.name}}</div>
+                </template>
               </el-table-column>
               <el-table-column prop="release" label="release" />
               <el-table-column prop="director" label="director" />