Как изменить метод фильтра компонента более высокого порядка в React? - PullRequest
Новая
       36

Как изменить метод фильтра компонента более высокого порядка в React?

0 голосов
/ 29 мая 2018

Как бы я изменил метод фильтра компонента при переносе его в HOC?Например, предположим: 

const LoaderHOC = (WrappedComponent) => {
  return class LoaderHOC extends Component{
    render(){
      <WrappedComponent {...this.props} />
    }
  }
}
export default LoaderHOC;

и теперь с компонентом без состояния, который будет выглядеть примерно так: 

const Results = props =>
 <div>
    {props.results.filter(item<20).map((item,index)=>
       <div>
           <SomeOtherComponent/>
       </div>
     )}
 </div>;
 export default Results;

Теперь я бы хотел изменить filter(item<20) из компонента Results назавернуть его в HOC что-то вроде filter(item=20)?

1 Ответ

0 голосов
/ 29 мая 2018

Вы можете сделать это, передав функцию сравнения 

const defaultComparator = (item) => {
    return item > 20;
}
const FilterHOC = (Component, comparator=defaultComparator) => {
   return (props) => {
        <div>
            {props.results.filter(comparator).map((item,index)=>
               <div>
                 <Component/>
               </div>
            )}
        </div>;
   }
}

, а затем можете использовать ее как 

const Comp = FilterHOC(SomeOtherComponent, (item) => {
    return item === 20
})
...