Failed prop type: Недопустимый компонент prop `типа` object` передан в Route, ожидаемая функция? - PullRequest
0 голосов
/ 11 апреля 2020
import React, { Component } from "react";
import { withRouter } from 'react-router';
import { NavLink } from 'react-router-dom';
import { connect } from 'react-redux';

import { logout } from '../../store/actions/auth';

class Navbar extends Component {
    render() {
        const { isAuthenticated } = this.props;


//Here I am trying to authenticate a user so once loggedIn the user can 
//manage the phlog using the phlog manager link

        const phlogManagerLink = (
            <div className='nav-link-wrapper'>
                <NavLink exact to='/phlog-manager/' activeClassName='nav-link-active'>
                    <button key='1' className='navbar-links-btn'>
                        <div className='navbar-links-btn-txt'>
                            Phlog Manager
                        </div>
                    </button>
                </NavLink>
            </div>
        );

        const logoutLink = (
            <div className='nav-link-wrapper'>
                <NavLink exact to='/' activeClassName='nav-link-active'>
                    <button key='1' className='navbar-links-btn' onClick={this.props.logout()}>
                        <div className='navbar-links-btn-txt'>
                            Logout
                        </div>
                    </button>
                </NavLink>
            </div>
        );

        return (


                    <div className='phlog-manager-signout-route'>
                        {
                            isAuthenticated ? (logoutLink && phlogManagerLink) : (null)
                        }
                    </div>

                </div>  
            </div>
        );
    }
}

const mapStateToProps = state => {
    return {
        isAuthenticated: state.auth.token !== null
    };
};

const mapDispatchToProps = dispatch => {
  return {
    logout: () => dispatch(logout())
    // loggedIn: () => dispatch(actions.authCheckState())
  };
};


export default withRouter(
    connect(
        mapStateToProps,
        mapDispatchToProps
    ) (Navbar)
);

Консоль браузера продолжает выдавать следующие предупреждающие сообщения:

checkPropTypes. js: 20 Предупреждение: сбойный тип пропелла: недопустимая опора component типа object, предоставленная для Route, ожидается function. в Route (создан App) в App в провайдере

реаги-dom.development. js: 88 Предупреждение. Невозможно обновить компонент (ConnectFunction) при рендеринге другого компонента (Navbar). Чтобы найти неправильный вызов setState () внутри Navbar, следуйте трассировке стека, как описано в

1 Ответ

0 голосов
/ 12 апреля 2020

Компонент, используемый для навигации, имел дело с аутентификацией, но не с состоянием входа в систему.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...