Есть ли способ передать хук жизненного цикла в качестве параметра HOC в React? - PullRequest
Новая
       26

Есть ли способ передать хук жизненного цикла в качестве параметра HOC в React?

0 голосов
/ 17 мая 2019

Я пытаюсь создать HOC-оболочку, где я мог бы выбрать, какой хук жизненного цикла передать. Я пробовал следующий HOC: 

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

export default HOC;

Компонент для переноса исходного компонента: 

import React from 'react';
import HOC from './helpers/hoc';
import componentDidMount from './helpers/componentDidMount';

const Home = () => <h1>Home</h1>;

export default HOC(componentDidMount)(Home);

и, наконец, жизненный цикл Hook: 

import React from 'react';

function componentDidMount(){
  console.log('Test')
}

export default componentDidMount;

РЕДАКТИРОВАТЬ: не генерируются ошибки компиляции, но журнал консоли не запускается для печати «Test»

1 Ответ

3 голосов
/ 17 мая 2019

Пакет recompose может сделать это для вас. Вот пример из помощника lifecycle: 

const PostsList = ({ posts }) => (
  <ul>{posts.map(p => <li>{p.title}</li>)}</ul>
)

const PostsListWithData = lifecycle({
  componentDidMount() {
    fetchPosts().then(posts => {
      this.setState({ posts });
    })
  }
})(PostsList);
...