如何在反应中使用 :-ms-reveal 作为内联样式？

Question

我试图隐藏在 Microsoft Edge 的输入框中输入密码时出现的眼睛（密码显示控件）。为了隐藏它，我们需要使用:-ms-reveal. 我尝试像MsReveal反应的内联风格一样使用它，但没有成功。由于CSS文件限制，我需要在项目中使用内联样式。那么有人可以帮助我解决这个问题吗？

Answer 1

花了将近一天的时间才找到我正在寻找的解决方案。场景是，如果您不想使用第三方软件包，例如Radium或Emotion ( css-to-js )，您可以按照以下方法操作。

使用模板文字来添加代码。

    const inputFieldStyle = `
               .inputField::-ms-reveal{
                       display: 'none'
               }`

然后您可以<style>在传递上述样式的地方使用标记，如下所示：

const reactFunctionalComponent = (props) => {
  ...
  return(
    <>
      <style>
        {inputFieldStyle}
      </style>
    ...
    </>
  )
}