@smoove1117

Не появляется preloader?

Не появляется preloader. Пробовал в networke замедлять интернет и все равно не вижу. Проверял появление элемента в html. Вроде как тоже не появился.
Код компоненты preloader
import React from "react";
import preloader from "../../../acces/img/5.gif"
const Preloader = () => {
    <div><img src={preloader}/> </div>
}

export default Preloader


Код с preloader
mport React from "react"
import { connect } from "react-redux"
import { followAC, unFollowowAC, setUsersAC, setCurrentPageAC, setUsersTotalCountAC, toggleAC } from "../../redux/user-reducer"
import Preloader from "../Dialogs/common/Preloader";
import axios from "axios";
import User from "./User";
class UsersApiComponent extends React.Component {
  componentDidMount() {
    this.props.toggleFetching(true)
    axios.get(`https://social-network.samuraijs.com/api/1.0/users?page=${this.props.currentUsers}&count=${this.props.pageSize}`)
    .then(response => {
      this.props.toggleFetching(false)
      this.props.setUsers(response.data.items);
  
  
    })
  };
  
  onPostChanged = (pageNumber) => {
    this.props.toggleFetching(true)
    this.props.setCurrentUsers(pageNumber);
    axios.get(`https://social-network.samuraijs.com/api/1.0/users?page=${pageNumber}&count=${this.props.pageSize}`)
    .then(response => {
      this.props.toggleFetching(false)
      this.props.setUsers(response.data.items)
    })
  }
  
  render () {
    return <> {this.props.isFetching ?  <Preloader/> : null }
    <User totalCountUser={this.props.totalCountUser} pageSize={this.props.pageSize} 
   currentUsers={this.props.currentUsers} users={this.props.users} onPostChanged={this.onPostChanged} 
   unFollowow={this.props.unFollowow} follow={this.props.follow} />
   </>
  }
  
   }
let mapStateToProps = (state) => {

    return {
   users: state.usersPage.users,
     pageSize: state.usersPage.pageSize,
     totalCountUser: state.usersPage.totalCountUser,
     currentUsers: state.usersPage.currentUsers,
     isFetching: state.usersPage.isFetching,
    }
    
   }


   let mapDispatchToProps = (dispatch) => {

    return {
        follow: (userId) => {
    dispatch(followAC(userId))
      },
      unFollowow: (userId) => {
        dispatch(unFollowowAC(userId))
      },
      
      setUsers: (user) => {
        dispatch(setUsersAC(user))
      },setCurrentUsers: (pageNumber) => {
        dispatch(setCurrentPageAC(pageNumber))
      },
      setTotalUsersCount: (totalCount) => {
        dispatch(setUsersTotalCountAC(totalCount))
      },
      toggleFetching: (isFetching) => {
        dispatch(toggleAC(isFetching))
      }
    
    }
   
    }

export default connect(mapStateToProps, mapDispatchToProps)(UsersApiComponent)
  • Вопрос задан
  • 54 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы