如何在 React 中绘制红色水平线

Question

如何使用动态颜色在反应组件中绘制水平线（hr）？

这是我到目前为止所拥有的：

 render {
    let color = 'red';
    return (
        <div>
            There is a red HR
           <hr />
        <div>
    )
}

原文由 sleatrou 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

设置组件的一种方法：

 const ColoredLine = ({ color }) => (
    <hr
        style={{
            color: color,
            backgroundColor: color,
            height: 5
        }}
    />
);

然后将其用于：

 <ColoredLine color="red" />

有关如何样式 <hr /> 的完整细分，请参阅 http://www.sovavsiti.cz/css/hr.html

原文由 Luke Willis 发布，翻译遵循 CC BY-SA 3.0 许可协议