Не появляется 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)