我尝试创建一个具有特定样式的按钮。 我有超过 3 个属性,如 justifyContent、alignItems、backgroundColor 和 height。我想将另一个组件的样式传递给该组件,以便按钮的 backgroundColor 属性发生变化。
我的代码:
import React from 'react';
import { Text, TouchableOpacity } from 'react-native';
const Button = ({ buttonName, csCode }) => {
const { buttonStyle, textStyle } = styles;
return (
<TouchableOpacity style={{ buttonStyle, backgroundColor: [csCode] }}>
<Text style={textStyle}>
{buttonName}
</Text>
</TouchableOpacity>
);
};
const styles = {
textStyle: {
alignSelf: 'center',
color: '#ffffff',
fontSize: 35,
fontWeight: '600',
},
buttonStyle: {
justifyContent: 'center',
alignSelf: 'stretch',
height: '20%',
}
};
export { Button };
此处,buttonStyle 未应用于按钮,而仅应用了 backgroundColor 属性。有什么帮助吗?
谢谢。
最佳答案
如果您想同时使用样式对象中的样式和内联样式,请将它们放入一个数组中,如下所示:
<TouchableOpacity style={[buttonStyle, {backgroundColor: csCode }]}>
...
</TouchableOpacity>
关于reactjs - 如何在react-native中传递特定组件的样式属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48132118/