Dialog: add title slot (#2657)

examples/docs/en-US/dialog.md

@@ -160,7 +160,7 @@ The content of Dialog can be anything, even a table or a form. This example show
 
 | Attribute      | Description          | Type      | Accepted Values       | Default  |
 |---------- |-------------- |---------- |--------------------------------  |-------- |
-| title     | title of Dialog | string    | —                               | —      |
+| title     | title of Dialog. Can also be passed with a named slot (see the following table) | string    | — | — |
 | size      | size of Dialog | string    | tiny/small/large/full | small |
 | top      | value for `top` of Dialog CSS, works when `size` is not `full` | string    | — | 15% |
 | modal     | whether a mask is displayed | boolean   | — | true |
@@ -175,6 +175,7 @@ The content of Dialog can be anything, even a table or a form. This example show
 | Name | Description |
 |------|--------|
 | — | content of Dialog |
+| title | content of the Dialog title |
 | footer | content of the Dialog footer |
 
 ### Methods

examples/docs/zh-CN/dialog.md

@@ -179,9 +179,9 @@ Dialog 组件的内容可以是任意的，甚至可以是表格或表单，下
 ### Attributes
 | 参数      | 说明          | 类型      | 可选值                           | 默认值  |
 |---------- |-------------- |---------- |--------------------------------  |-------- |
-| title     | Dialog 的标题 | string    | —                               | —      |
+| title     | Dialog 的标题，也可通过具名 slot （见下表）传入 | string    | — | — |
 | size      | Dialog 的大小 | string    | tiny/small/large/full | small |
-| top       | Dialog CSS 中的 top 值（仅在 size 不为 full 时有效） | string    | —                       | 15%     |
+| top       | Dialog CSS 中的 top 值（仅在 size 不为 full 时有效） | string | — | 15% |
 | modal     | 是否需要遮罩层   | boolean   | — | true |
 | lock-scroll | 是否在 Dialog 出现时将 body 滚动锁定 | boolean | — | true |
 | custom-class      | Dialog 的自定义类名 | string    | — | — |
@@ -193,6 +193,7 @@ Dialog 组件的内容可以是任意的，甚至可以是表格或表单，下
 | name | 说明 |
 |------|--------|
 | — | Dialog 的内容 |
+| title | Dialog 标题区的内容 |
 | footer | Dialog 按钮操作区的内容 |
 
 ### 方法

packages/dialog/src/component.vue

@@ -7,7 +7,9 @@
         ref="dialog"
         :style="style">
         <div class="el-dialog__header">
-          <span class="el-dialog__title">{{title}}</span>
+          <slot name="title">
+            <span class="el-dialog__title">{{title}}</span>
+          </slot>
           <div class="el-dialog__headerbtn">
             <i v-if="showClose" class="el-dialog__close el-icon el-icon-close" @click='close()'></i>
           </div>