React material-ui组件,实现类时如何覆盖JSS样式

时间:2018-12-02 21:48:25

标签: javascript css reactjs material-ui jss

请考虑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/>
}

我似乎找不到任何指示应该怎么做。

0 个答案:

没有答案