這實際上是我在 react 上的第一個組件（也是 react-native），所以如果錯誤是基本的，請不要發誓。
我想制作一個flex組件并將子組件和direction="column"引數傳遞給它，但我仍然有flex-direction: row
怎么了？
file 'flex.js':
const StyledFlex = styled.View`
display: flex;
flex-direction: ${props => props.direction || "row"};
`;
const Flex = (props) => {
return <StyledFlex> {props.children}</StyledFlex>
}
----
usage:
export default function App() {
return (
<View>
<StatusBar />
<Header>
<Flex direction="column">
<ButtonStatistic />
<ButtonAdd />
</Flex>
</Header>
</View>
)
}
結果：
如您所見，按鈕排成一行
uj5u.com熱心網友回復：
您不會將道具傳遞給 StyledFlex。
const Flex = (props) => {
return <StyledFlex {...props}>
{props.children}</StyledFlex>
}
uj5u.com熱心網友回復：
是的，我處理了同樣的問題。
請嘗試安裝和使用這些包“native-base”、“styled-system”和“styled-components”？
而且我不確定道具是否在這里作業。
const StyledFlex = styled.View`
display: flex;
flex-direction: ${props => props.direction || "row"};
`;
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/512262.html
標籤：反应反应式样式化组件
上一篇：你能在ReactNativeDebugger中關閉黃色警告嗎？
下一篇：如何將模型類回傳到串列中