12345678910111213141516171819202122232425262728293031323334353637383940 |
- import React, {useEffect, useState} from "react";
- import {connect} from 'react-redux';
- import {AdFeed} from "../Components/CAdFeed";
- import { actionTypeAd} from "../actions";
- import CPromiseComponent from "../Components/PromiseComponent";
- export const Home = ({getData,data}) => {
- const [fetching,setFetching] = useState(true)
- const [current,setCurrent] = useState(0)
- useEffect(()=>{
- if(fetching){
- getData()
- }},[fetching])
- useEffect(() => {
- document.addEventListener('scroll',scrollHandler)
- return function() {
- document.removeEventListener('scroll',scrollHandler)
- }
- },[])
- const scrollHandler = (e) => {
- if(e.target.documentElement.scrollHeight - (window.innerHeight + e.target.documentElement.scrollTop)< 100){
- setFetching(true)
- console.log(e.target.documentElement.scrollHeight)
- }
- }
- if(data){
- return (
- <CPromiseComponent promiseName='AdFind'>
- <div>
- {data.map(ad => <AdFeed key={ad._id} _id = {ad. _id} price = {ad.price} title = {ad.title} description={ad.description} owner={ad.owner} images={ad.images} comments={ad.comments} />)}
- </div>
- </CPromiseComponent>
- )
- }
- }
- const TypeAd = connect(state => ({data: state.promiseReducer.AdFind?.payload?.data?.AdFind || []}),{getData: actionTypeAd})(Home)
- export default TypeAd
|