https://medium.com/@srph/react-render-props-as-filtering-layer-5404b0be7184

Column.js

import React, {Component} from 'react'
import SortingLayer from './SortingLayer'

class Column extends Component {
  state = {
    list: [], // Let's pretend this is filled by some AJAX request
    sorting: 0
  }

  render() {
    return (
      <SortingLayer list={this.state.list} sorting={this.state.sorting}>
        {(list) => (
          list.map((item, i) => (
            <div key={i}>
              {item.title}
            </div>
          )
        )}
      </SortingLayer>
    )
  }

  handleFilter(sorting) {
    this.setState({ sorting })
  }
}

SortingLayer.js

import React, {Component} from 'react'

class SortingLayer extends Component {
  state = {
    list: this.filter(this.props)
  }

  componentWillReceiveProps(nextProps) {
    if (nextProps.list !== this.props.list) {
      this.setState({ list: this.filter(nextProps) })
    }
  }

  render() {
    return this.props.children(this.state.list)
  }

  filter(props) {
    switch(props.sorting) {
      case 1:
        //
      case 2:
        //
      case 3:
        //
      default:
        return props.list
    }
  }
}

export default SortingLayer