el-dialog 设置标头
时间: 2023-10-05 18:04:48 浏览: 97
在使用el-dialog组件时,可以通过在title属性里使用插槽的方式来设置多个不同样式的字符串。具体做法是在title属性的值前面加上`<template>`标签,并在内部使用`<span>`等标签来包裹需要设置不同样式的字符串。例如:
```html
<el-dialog :title="`<template><span style='color: red;'>Hello</span> <span style='color: blue;'>World</span></template>`">
<!-- 对话框内容 -->
</el-dialog>
```
这样就可以在el-dialog的标题中设置两个不同样式的字符串,分别为"Hello"和"World",其中"Hello"的颜色为红色,"World"的颜色为蓝色。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [通过具名 slot (插槽) 来显示Dialog 的标题](https://blog.csdn.net/qyl_0316/article/details/107967547)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *2* [elementui dialog弹框带虚线拖拽](https://blog.csdn.net/m0_71818580/article/details/128260770)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *3* [element ui 对话框el-dialog关闭事件详解](https://download.csdn.net/download/weixin_38660108/12763272)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
[ .reference_list ]
阅读全文