Реагировать на идентичность компонента высшего порядка - PullRequest
Новая
       18

Реагировать на идентичность компонента высшего порядка

0 голосов
/ 19 сентября 2018

Как сделать идентификационный компонент более высокого порядка, то есть компонент более высокого порядка, который просто визуализирует входной компонент?

Для иллюстрации: учитывая компонент 

const TestComponent = () => <div>TEST</div>

Я бы хотелследующие значения эквивалентны: 

export default TestComponent;
export default identityHOC(TestComponent);

Я пробовал 

const identityHOC = (Component) => (props) => Component(props);
const identityHOC = (Component) => (props) => () => Component(props);
const identityHOC = (Component) => (props) => <Component {...props} />;
const identityHOC = (Component) => (props) => () => <Component {...props} />;

и другие варианты, но они не работают.

1 Ответ

0 голосов
/ 19 сентября 2018

HOC - это в основном просто функция , которая при поставке с компонентом возвращает другой (или такой же, если хотите) компонент.

Попробуйте это 

import React from 'react';

const identityHOC = (WrappedComponent) => {
  class HOC extends React.Component {
    constructor(props){
      super(props)
    }
    render() {
      return <WrappedComponent {...this.props}/>;
    }
  }

  return HOC;
};

Если вы хотите записать его как функциональный компонент, 

import react from 'React'
const identityHOC = (WrappedComponent) => props => 
  (<WrappedComponent {...props}/>)

Возможно, вы забыли импортировать React.

...