Как я могу вернуть реагирующий компонент, используя withStyles?

Question

Вопрос здесь не в том, как экспортировать, а в том, как вернуть объект React с введенным css?

Я пытаюсь добиться чего-то вроде этого:

return ( withStyles(this.props.style)(<Component {...params}/>) );

Где намерение состоит в том, чтобы вернуть Компонент со всем CSS, установленным с использованием withStyles, и с его стилями, введенными в свойство, называемое стилем.

Answer 1

withStyles HOC принимает класс / функцию и возвращает декорированный класс / функцию. Вот почему мы не можем передать туда экземпляр компонента (<Component {...params}> создает / возвращает объект под капот).

Имея это в виду и требование JSX, чтобы имя компонента начиналось с заглавной буквы, мы можем сделать следующее:

const StyledComponent = withStyles(this.props.style)(Component);
return <StyledComponent {...params} />;