Tengo problemas para ver que los estilos se aplican desde mi componente al convertir mi componente de un componente basado en clases a uno basado en funciones.
probablemente esté relacionado con el problema de HOC.
Entonces, en mi componente, tengo los estilos definidos a continuación;
const styles = ({palette: {somekit}}) => ({ tabs: { backgroundColor: somekit.grey }, })Anteriormente, era un componente basado en clases como se muestra a continuación (y pude ver que los estilos se seleccionaban desde arriba)
class MyHeader extends React.Component{}Sin embargo, después de convertirlo en un componente basado en funciones como se muestra a continuación, los estilos definidos anteriormente no parecen estar siendo recogidos.
function MyHeader(props) {}En ambos casos, tenía la exportación definida como se muestra a continuación;
export default withRouter(withStyles(styles, {name: 'MyStyle'})(MyHeader));Sospecho que hay algún problema con la forma en que el componente se exporta arriba cuando se convierte de basado en clases a basado en funciones. ¿Esta exportación parece adecuada cuando se usa un componente basado en funciones?
---Actualizado--- Así es como se define withStyles;
import { withStyles as withStylesWODefault } from '@material-ui/styles'; import defTheme from './defTheme'; export default function withStyles(styles, options) { return withStylesWODefault(styles, { defTheme, ...options }); }