@DaniilRuss

Ошибка: Unhandled Rejection (TypeError): this.props.isAuth is not a function, как исправить?

При выходе выдает ошибку : Unhandled Rejection (TypeError): this.props.isAuth is not a function
Что не так ? Не судите строго, мой перый проект на react

Вот код

class Panel extends React.Component {
	constructor(props) {
		super(props)
		this.state = {
			isLoggedIn: true,
		}
	}
	

	state = {
		collapsed: false,
		size: 'large',
	};

  toggle = () => {
    this.setState({
      collapsed: !this.state.collapsed,
    });
	};

	logOut () {
		const config = {
			headers: {
				Authorization: `Bearer ${localStorage.getItem('api_token')}`
			}
		};
		axios.post('/api/logout', {}, config)
			.then((res) => {
				if (res.status === 200) {
					localStorage.removeItem('api_token');
					localStorage.setItem('auth', false)
					this.props.isAuth(JSON.parse(localStorage.getItem('auth')));
					this.props.history.push('/signin')
				}
			});
	}

  render() {
		const { size } = this.state;
    return (
			<Router>
				<Layout> 
        <Sider trigger={null} collapsible collapsed={this.state.collapsed}>
          <div className="logo" />
          <Menu theme="dark" mode="inline" defaultSelectedKeys={['1']}>
						<h3 className="menu__title">Меню</h3>
							<Menu.Item key="1">
								<UserOutlined />
								<Link to={ROUTES.MAIN}>Главная</Link>
							</Menu.Item>
							<Menu.Item key="2">
								<UnorderedListOutlined />
								<Link to={ROUTES.ORDERS}>Заказы</Link>
            	</Menu.Item>
							<Menu.Item key="3">
								<DollarOutlined />
								<Link to={ROUTES.PRICES}>Цены</Link>
            	</Menu.Item>
							<Menu.Item key="4">
								<PhoneOutlined />
								<Link to={ROUTES.CALLBACK}>Обратные звонки</Link>
							</Menu.Item>
							<Menu.Item key="5">
								<FileDoneOutlined />
								<Link to={ROUTES.OURWORKS}>Наши работы</Link>
							</Menu.Item>
							<Menu.Item key="6">
								<LikeOutlined />
								<Link to={ROUTES.FEEDBACK}>Отзывы</Link>
							</Menu.Item>
						</Menu>
					</Sider>
					<Layout className="site-layout">
						<Header className="site-layout-background header" style={{ padding: 0 }}>
							<div className="header-left">
								<Button type="primary"
											icon={this.state.collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined/>} 
											size={size} onClick={this.toggle}
											className="header__button"/>
								<div className="header__title">
									<h1>Ремонт под ключ</h1>
									<span>панель администратора</span>
								</div>
							</div>
							<div className="header-right">
								<Popconfirm title="Вы уверенны что хотите выйти?"
								 onConfirm={this.logOut} okText="Да" cancelText="Нет" placement="bottomRight">
									<Button type="primary"
												shape="circle"
												icon={<LogoutOutlined />} 
												size={size}
												className="header__logout"/>
								</Popconfirm>
							</div>
						</Header>
						<Content className="site-layout-background"style={{ margin: '24px 16px', padding: 24, minHeight: 710,}} >
								<Route exact path={ROUTES.MAIN} component={Main} />
								<Route path={ROUTES.ORDERS} component={Orders} />
								<Route path={ROUTES.PRICES} component={Prices} />
								<Route path={ROUTES.CALLBACK} component={CallBack} />
								<Route path={ROUTES.OURWORKS} component={OurWorks} />
								<Route path={ROUTES.FEEDBACK} component={Feedback} />		
						</Content>
					</Layout>
				</Layout>
			</Router>			
			);
  }
}

export default class App extends Component {
	constructor(props) {
		super(props)
	
		this.state = {
			user: props.userData,
			isLoggedIn: JSON.parse(localStorage.getItem('auth')),
		}
	}

	isAuth = (value) => {
    this.setState({ isLoggedIn: value })
	}
	
	render() {
		return (
			<Router>
				{this.state.isLoggedIn
					? <Panel isAuth={this.isAuth}/> 
					: <SingIn isAuth={this.isAuth}/> 			
				}
			</Router>
		);
	}
}


Ошибка :
5ebc14eaa13c6913997264.png
  • Вопрос задан
  • 472 просмотра
Решения вопроса 1
0xD34F
@0xD34F Куратор тега React
Делай раз:

logOut () {

Делай два:

onConfirm={this.logOut}

Всё, контекст потерян.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
17 мая 2024, в 22:37
20000 руб./за проект
17 мая 2024, в 22:33
1000 руб./за проект
17 мая 2024, в 22:30
5000 руб./за проект