Merge remote-tracking branch 'upstream/dev' into dev

FAQ.md

@@ -19,10 +19,12 @@
 <details>
 <summary>如何在 Table 组件的每一行添加操作该行数据的按钮？</summary>
 
-使用 inline-template 即可：
+使用 [Scoped slot](https://vuejs.org/v2/guide/components.html#Scoped-Slots) 即可：
 ```html
-<el-table-column label="操作" inline-template>
-  <el-button @click.native="showDetail(row)">查看详情</el-button>
+<el-table-column label="操作">
+  <template scoped="props">
+    <el-button @click.native="showDetail(props.row)">查看详情</el-button>
+  </template>
 </el-table-column>
 ```
 参数 `row` 即为对应行的数据。
@@ -41,7 +43,7 @@
 ```css
 [class^="el-icon-my"], [class*=" el-icon-my"] {
   font-family:"your-font-family" !important;
-  
+
   /* 以下内容参照第三方图标库本身的规则 */
   font-size: inherit;
   font-style:normal;
@@ -104,10 +106,12 @@ For other components, the `.native` modifier is still mandatory.
 <details>
 <summary>How do I add buttons in each row of Table to operate data of that row?</summary>
 
-Just use `inline-template`:
+Just use [Scoped slot](https://vuejs.org/v2/guide/components.html#Scoped-Slots):
 ```html
-<el-table-column label="Operations" inline-template>
-  <el-button @click.native="showDetail(row)">Details</el-button>
+<el-table-column label="Operations">
+  <template scoped="props">
+    <el-button @click.native="showDetail(props.row)">Details</el-button>
+  </template>
 </el-table-column>
 ```
 The parameter `row` is the data object of corresponding row.
@@ -126,7 +130,7 @@ You just need to modify the class name prefix of the third-party library (see th
 ```css
 [class^="el-icon-my"], [class*=" el-icon-my"] {
   font-family:"your-font-family" !important;
-  
+
   /* The following is based on original CSS rules of third-party library */
   font-size: inherit;
   font-style:normal;

packages/dropdown/src/dropdown.vue

@@ -1,6 +1,8 @@
 <script>
   import Clickoutside from 'element-ui/src/utils/clickoutside';
   import Emitter from 'element-ui/src/mixins/emitter';
+  import ElButton from 'element-ui/packages/button';
+  import ElButtonGroup from 'element-ui/packages/button-group';
 
   export default {
     name: 'ElDropdown',
@@ -11,6 +13,11 @@
 
     directives: { Clickoutside },
 
+    components: {
+      ElButton,
+      ElButtonGroup
+    },
+
     props: {
       trigger: {
         type: String,

packages/table/src/table-header.js

@@ -94,45 +94,45 @@ export default {
           {
             this._l(columnRows, (columns, rowIndex) =>
               <tr>
-                {
-                  this._l(columns, (column, cellIndex) =>
-                    <th
-                      colspan={ column.colSpan }
-                      rowspan={ column.rowSpan }
-                      on-mousemove={ ($event) => this.handleMouseMove($event, column) }
-                      on-mouseout={ this.handleMouseOut }
-                      on-mousedown={ ($event) => this.handleMouseDown($event, column) }
-                      on-click={ ($event) => this.handleClick($event, column) }
-                      class={ [column.id, column.order, column.headerAlign, column.className || '', rowIndex === 0 && this.isCellHidden(cellIndex) ? 'is-hidden' : '', !column.children ? 'is-leaf' : ''] }>
-                      <div class={ ['cell', column.filteredValue && column.filteredValue.length > 0 ? 'highlight' : ''] }>
-                      {
-                        column.renderHeader
-                          ? column.renderHeader.call(this._renderProxy, h, { column, $index: cellIndex, store: this.store, _self: this.$parent.$vnode.context })
-                          : column.label
-                      }
-                      {
-                        column.sortable
-                          ? <span class="caret-wrapper">
-                              <i class="sort-caret ascending" on-click={ ($event) => this.handleHeaderClick($event, column, 'ascending')}></i>
-                              <i class="sort-caret descending" on-click={ ($event) => this.handleHeaderClick($event, column, 'descending')}></i>
-                            </span>
-                          : ''
-                       }
-                       {
-                         column.filterable
-                           ? <span class="el-table__column-filter-trigger" on-click={ ($event) => this.handleFilterClick($event, column) }><i class={ ['el-icon-arrow-down', column.filterOpened ? 'el-icon-arrow-up' : ''] }></i></span>
-                           : ''
-                        }
-                       </div>
-                      </th>
-                    )
-                  }
-                  {
-                    !this.fixed && this.layout.gutterWidth
-                      ? <th class="gutter" style={{ width: this.layout.scrollY ? this.layout.gutterWidth + 'px' : '0' }}></th>
-                      : ''
-                  }
-                </tr>
+              {
+                this._l(columns, (column, cellIndex) =>
+                  <th
+                    colspan={ column.colSpan }
+                    rowspan={ column.rowSpan }
+                    on-mousemove={ ($event) => this.handleMouseMove($event, column) }
+                    on-mouseout={ this.handleMouseOut }
+                    on-mousedown={ ($event) => this.handleMouseDown($event, column) }
+                    on-click={ ($event) => this.handleClick($event, column) }
+                    class={ [column.id, column.order, column.headerAlign, column.className || '', rowIndex === 0 && this.isCellHidden(cellIndex) ? 'is-hidden' : '', !column.children ? 'is-leaf' : ''] }>
+                    <div class={ ['cell', column.filteredValue && column.filteredValue.length > 0 ? 'highlight' : ''] }>
+                    {
+                      column.renderHeader
+                        ? column.renderHeader.call(this._renderProxy, h, { column, $index: cellIndex, store: this.store, _self: this.$parent.$vnode.context })
+                        : column.label
+                    }
+                    {
+                      column.sortable
+                        ? <span class="caret-wrapper">
+                            <i class="sort-caret ascending" on-click={ ($event) => this.handleHeaderClick($event, column, 'ascending')}></i>
+                            <i class="sort-caret descending" on-click={ ($event) => this.handleHeaderClick($event, column, 'descending')}></i>
+                          </span>
+                        : ''
+                    }
+                    {
+                      column.filterable
+                         ? <span class="el-table__column-filter-trigger" on-click={ ($event) => this.handleFilterClick($event, column) }><i class={ ['el-icon-arrow-down', column.filterOpened ? 'el-icon-arrow-up' : ''] }></i></span>
+                        : ''
+                    }
+                    </div>
+                  </th>
+                )
+              }
+              {
+                !this.fixed && this.layout.gutterWidth
+                  ? <th class="gutter" style={{ width: this.layout.scrollY ? this.layout.gutterWidth + 'px' : '0' }}></th>
+                  : ''
+              }
+              </tr>
             )
           }
         </thead>