请考虑this question中的代码。给出样式的答案是使用类似的东西:
import React, { Component } from 'react';
import AppBar from '@material-ui/core/AppBar';
import Toolbar from '@material-ui/core/Toolbar';
import logo from '../Assets/logo.svg';
import { withStyles } from '@material-ui/core/styles';
const styles = {
transparentBar: {
backgroundColor: 'transparent !important',
boxShadow: 'none',
paddingTop: '25px',
color: '#FFFFFF'
}
};
class NavigationBar extends Component {
render() {
return (
<AppBar className={classes.transparentBar}>
<Toolbar>
<img src={logo} style={{ height: '28px' }} />
</Toolbar>
</AppBar>
);
}
}
export default withStyles(styles)(NavigationBar);
但是,在我的情况下,当我“使用”此类时,我希望“覆盖”样式对象。
import TransparentNavigationBar from './MyNavigationBar'
const localstyles = {
transparentBar: {
paddingTop: '0px',
paddingBottom: '10px',
}
}
function SomeComponent(props) {
//do something to inject local style definition above into TransparentNavigationBar
return <TransparentNavigationBar/>
}
我似乎找不到任何指示应该怎么做。