расширение пользовательского интерфейса материала стиля

есть ли способ расширить стиль на reactjs. Я пробовал расширить стиль, но его работа не работает.

cellItem:{
 color: "black",
    fontWeight: "bold",
    [theme.breakpoints.down("xs")]: {
      fontSize: "0.8em"
    },
},

tableCellItem: {
   extend:"cellItem", --> here I extend parent style
    fontSize: "1.5em"
  },
  tableCellItemInSingleScreen: {
      extend:"cellItem",--> here I extend parent style
    fontSize: "2.5em"
  }

reactjs material-ui jss
person Mina Fawzy    schedule 22.05.2019    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Для этого вы можете просто использовать функции JavaScript:

const styles = theme => {
  const cellItem = {
    color: "black",
    fontWeight: "bold",
    [theme.breakpoints.down("xs")]: {
      fontSize: "0.8em"
    }
  };
  return {
    cellItem,
    tableCellItem: {
      ...cellItem,
      fontSize: "1.5em"
    },
    tableCellItemInSingleScreen: {
      ...cellItem,
      fontSize: "2.5em"
    }
  };
};

В JSS есть плагин расширения, который вызовет ваш синтаксис работает, но это не один из подключаемых модулей, , включенных в Material-UI по умолчанию, но вы можете добавить этот плагин.

Связанный ответ: Расширенный стиль в material-ui

person Ryan Cogswell    schedule 22.05.2019