ElNotification({ message: successMessage, dangerouslyUseHTMLString: true, type: 'success',这样自定义样式引入乱码
时间: 2024-03-10 14:44:40 浏览: 27
如果你在 Element Plus Notification 组件中使用了自定义 HTML 字符串,并且同时开启了 `dangerouslyUseHTMLString`,那么你需要确保你的 HTML 代码中使用的所有样式都是有效的 CSS 样式,而不是一些非标准的样式或未识别的属性,否则可能会导致样式混乱或乱码的问题。
如果你的样式表中包含了一些非标准的样式或未识别的属性,可以尝试使用标准的 CSS 属性来替换它们,或者使用内联样式来覆盖它们。例如,如果你的样式表包含了以下样式:
```
.my-custom-style {
font-family: '微软雅黑';
-webkit-box-shadow: 0 0 10px #ccc;
-moz-box-shadow: 0 0 10px #ccc;
box-shadow: 0 0 10px #ccc;
}
```
你可以将其替换为以下标准的 CSS 样式:
```
.my-custom-style {
font-family: '微软雅黑', sans-serif;
box-shadow: 0 0 10px #ccc;
}
```
如果你的样式表中包含了一些无法替换的样式,你可以尝试使用内联样式来覆盖它们。例如,如果你的样式表包含了以下样式:
```
.my-custom-style {
background-color: #f00;
color: #0f0;
}
```
你可以在 Element Plus Notification 组件中使用内联样式来覆盖它们:
```
ElNotification({
message: '<div style="background-color: #f00; color: #0f0;">' + successMessage + '</div>',
dangerouslyUseHTMLString: true,
type: 'success'
});
```
这样就能确保你的样式能够正确地应用到 Element Plus Notification 组件中,而不会出现乱码或混乱的情况。