我正在使用 React styled-components 库来设计我的应用程序并偶然发现一个问题,我无法根据传递给组件的 props 分配 CSS 属性。
import React from 'react'
import styled from 'styled-components'
const Bar = styled.div`
width: ${props => props.fraction}px;
`
const bar = (props) => {
return (
<Bar>{props.fraction}</Bar>
)
};
export default bar
分数属性从父组件传递并在样式组件内完美输出,但样式中分配的宽度属性在开发人员工具中交叉,那里只有 px,所以分数甚至没有到达那里。
如有任何帮助,我将不胜感激! 非常感谢
最佳答案
您应该将 fraction
作为属性传递给 Bar 组件,如下所示:
cost BarComponent = ({ fraction }) => (
<Bar fraction={fraction}>{fraction}</Bar>
);
关于javascript - 在 React 风格的组件中使用 props,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50887176/