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

Question

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

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

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

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

Answer 1

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

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

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