Функция Hoc не может получить реквизиты реакции-редукса - PullRequest
Новая
       7

Функция Hoc не может получить реквизиты реакции-редукса

0 голосов
/ 08 июня 2018

Я хочу использовать метод подключения из activ-redux, чтобы передать реквизиты в функцию высокого порядка реагирования.

Функция обертки: 

export const withInfiniteScroll = (Component) =>
  class WithInfiniteScroll extends React.Component {
    componentDidMount() {
      window.addEventListener('scroll', this.onScroll, false)
    }
    componentWillUnmount() {
      this.props.initPage()
      window.removeEventListener('scroll', this.onScroll, false)
    }
    onScroll = () => {
      (
        (window.innerHeight + window.scrollY) >= (document.body.offsetHeight - 500)
          && this.props.stocks.length
      )
        && this.props.onPaginatedSearch()
    }
    render() {
      return <Component {...this.props}/>
    }
  }

И компонент обернут:

const StockCard = ({ stocks }) =>
  stocks.errmsg === 'ok' ?
    stocks.data.map (
      (stock, i) =>
        <CardContainer key={i}>
          <p>{stock.cinvcode}</p>
          <p>{stock.cinvname}</p>
        </CardContainer>
      ) : ''

Получите специальную функцию: 

const StockCardWithInfiniteScroll = withInfiniteScroll(StockCard)

Редуктор: 

const initState = {
  ...
  stocks: {
    errcode: '',
    errmsg: '',
    data: []
  }
}

export const PAGE_INIT = 'PAGE_INIT'
export const initPage = () => ({type: PAGE_INIT, payload: 0})

export const STOCK_FETCH = 'STOCK_FETCH'
export const updateStock = (res) => ({type: STOCK_FETCH, payload: res})
export const onPaginated = (searchStock) => {
  return(dispatch) => {
    const searchStockNextPage = {
      ...searchStock,
      pageindex: searchStock.pageindex + 1
    }
    // console.log(searchStockNextPage)
    getStock(searchStockNextPage)
      .then(res => dispatch(updateStock(res)))
      .then(res => console.log(res))
  }
}

const stockReducer = (state = initState, action) => {
  switch (action.type) {
    ...
    case PAGE_INIT:
      return {
        ...state,
        searchStock: {...state.searchStock, page: 0}
      }
    case STOCK_FETCH:
      return {
        ...state,
        stocks: state.stocks.data.concat(action.payload.data)
      }
    default:
      return state
  }
}

Последнее использование метода connect для передачи реквизитов из redux: 

export default connect(
  (state) => ({
    stocks: state.stock.stocks
  }),
  {onPaginated, initPage}
)(StockCardWithInfiniteScroll)

Я вижу реквизиты акций обратной связи в консоли браузера, но StockCard не может их получить.

...