Реагируйте с Typescript: свойство «push» не существует для типа «History» - PullRequest
Новая
       11

Реагируйте с Typescript: свойство «push» не существует для типа «History»

0 голосов
/ 03 июля 2018

Я пытаюсь отойти от вида, нажав на объект истории. Однако когда я пытаюсь протолкнуть в него маршрут, я получаю сообщение об ошибке:

Свойство «push» не существует для типа «History». 

  render(){
    return (
        <div className="loginWrapper">
    withRouter(({history}) => (<button onClick={()=>{history.push('/home')}} className="btn btn-primary">Pieteikties</button>))
  </div>
    )  
}

Что я могу сделать, чтобы это исправить?

EDIT:

Я тоже пробовал это: 

logIn(){
  this.props.history.push('/new-location')
}

с таким компонентом: 

 render(){
    return (
        <div className="loginWrapper">
<button onClick={this.logIn} className="btn btn-primary">Pieteikties</button>
</div>
    )  
}

И это не сработало.

Ответы [ 2 ]

0 голосов
/ 03 июля 2018

В React 16 и более поздних версиях вы можете использовать перенаправление из'act-router-dom '. В вашем случае вы получите те же результаты, если будете использовать перенаправление вместо истории. 

import  { Redirect } from 'react-router-dom'

Определение состояния в вашем компоненте 

this.state = {
  loginStatus:true
}

чем в вашем методе рендеринга 

render () {
if(this.state.loginStatus){
    return <Redirect to='/home'  />
 }
return(
 <div> Please Login </div>
 )
}

Редактировать: используя this.props.history

Есть две вещи, которые я нашел отсутствующими в вашем коде. Одним из них является ваш метод входа связывание. Свяжите свой метод, чтобы вы могли получить доступ к this класса. Другие вещи использовать withRouter HOC. withRouter даст вам доступ к этой истории. Как и так ниже. 

import React from "react";
import { withRouter } from "react-router";

class MainClass extends Component {
  constructor(props) {
      this.login = this.login.bind(this)
   }

  logIn(){
      this.props.history.push('/new-location')
   }

   render(){
     return (
       <div className="loginWrapper">
          <button onClick={this.logIn} className="btn btn- 
          primary">Pieteikties</button>
      </div>
      )  
    }

 export default withRouter(MainClass);
0 голосов
/ 03 июля 2018

Где вы определили history здесь? Существует глобальный window.history, который является веб-стандартом. Если вы хотите использовать историю реагирующего маршрутизатора , она передается как реквизит. Попробуйте props.history.push() вместо.

...