Как применить стиль кнопки Material-UI к html -нной кнопке - PullRequest
Новая
       4

Как применить стиль кнопки Material-UI к html -нной кнопке

0 голосов
/ 23 марта 2020

чисто-реагирующая карусель дает мне неустановленную кнопку html (ButtonBack), и я хочу оформить ее, используя material-ui .

Размещение кнопок внутри кнопок не допускается .

Что помогает назначить реквизит className вручную: 

<ButtonBack className={"MuiButtonBase-root MuiButton-root MuiButton-contained"}>
  <NavigateBeforeIcon />
</ButtonBack>

Но это выглядит неправильно, а также не отображается как хорошо, как настоящая кнопка Mui.

Конечно, я мог бы написать свой собственный css, который имитирует Muis, но это тоже неправильно.

Есть ли более простой / прямой путь к этому проблема?

1 Ответ

0 голосов
/ 23 марта 2020 
import { ButtonFirst } from 'pure-react-carousel';
import Button from '@material-ui/core/Button';

const CustomButtonFirst = React.forwardRef((props, ref) => <Button component={ButtonFirst} ref={ref} {...props} />);

// This line is needed because the "disabled" is internal state of "ButtonFirst".
export default withStore(CustomButtonFirst, state => ({ disabled: state.currentSlide === 0 }));

Взято из: https://github.com/express-labs/pure-react-carousel/issues/175

...