element-ui中，使用this.$message.success(“登录成功“)，如何修改文字的样式呢？

在 element-ui 中使用 this.$message.success(“注册成功”); 时，直接修改文字样式并没有暴露出很方便的接口，因为 Element UI 的消息提示组件 Message 是通过 JavaScript 动态创建的。

但是你可以通过以下方法自定义消息的样式：

方法 1：使用 customClass 属性

Element UI 的 Message 组件提供了 customClass 属性，可以为消息框添加自定义的类名，然后在 CSS 中定义该类的样式。

this.$message({
  message: '注册成功',
  type: 'success',
  customClass: 'my-message-class'
});

然后在你的 CSS 中定义该类样式：

.my-message-class {
  font-size: 18px; /* 自定义文字大小 */
  color: red; /* 自定义文字颜色 */
}

方法 2：全局自定义 Message 样式

如果你需要全局修改 Message 组件的样式，可以覆盖 Element UI 内置的样式。

例如，针对 success 类型的消息，可以在全局样式中使用以下 CSS：

.el-message--success {
  font-size: 18px; /* 修改成功消息的字体大小 */
  color: blue; /* 修改成功消息的文字颜色 */
}

这样，你每次调用 this.$message.success 时，消息文字样式都会应用这些自定义样式。

方法 3：使用 HTML 内容

如果你想在消息内容中使用 HTML 标签，可以用 dangerouslyUseHTMLString 属性：

this.$message({
  message: '<strong>注册成功</strong>',
  type: 'success',
  dangerouslyUseHTMLString: true
});

我使用的是方法3，亲测有效！！！