Vue3：在渲染时将 HEX 颜色转换为 RGB

Question

由于某些电子邮件客户端不支持 RGB/RGBA 颜色值，我需要在我的电子邮件模板中使用 HEX 代码，但似乎 vue3 在渲染时会将 Hex 转换为 RGB。有什么解决办法吗？

Answer 1

在 JS 中设置样式时，转换不是由 Vue 完成的，而是由 by the browser 完成的 - 请参阅此 demo（并且 Vue 由 JS 完成所有渲染）

因此，如果您想从 DOM 中获取呈现的 HTML，它是行不通的。有两种可能的解决方案：

1. 从浏览器中获取 Vue 呈现的 HTML 作为字符串，然后简单地搜索并替换 rgb()（转换为十六进制颜色）
2. 不呈现到浏览器。 Vue 有用于 SSR 应用程序的服务器端渲染器，可以直接渲染成字符串。问题是它是suppose to run inside Node

Answer 2

由于您不能使用 CSS 类（它们保留您选择的颜色格式），我认为您的问题只发生在浏览器中。电子邮件客户端应保持颜色为十六进制。

似乎浏览器在通过JS设置样式时总是将颜色转换为rgb。 https://forum.vuejs.org/t/stop-vue-js-from-converting-hex-color-values-to-rgb/39857/3