React:this.props.history.push 점프 실패의 사고와 해결
6319 단어 react
import axios from axios
handleClick = () => {
let params = {
username: this.state.username,
password: this.state.password
}
axios.get('/server/data.json', params)
.then((res) => {
if (res.data.success) {
console.log(res.data.errmsg)
//
this.props.history.push('/home')
}
})
}
이치대로 말하면, 이 작법은 틀리지 않았다.있을 거 다 있어.페이지를 이동할 수 없습니다.매번 점프를 할 때마다 페이지는 로그인 페이지를 맴돌지만 넘어가지 않는다.그래서!!나는 페이지의 기본 이벤트가 일으킨 것인지 생각했다.이 사고방식에 따라 나는 코드를 약간 수정했다.
import axios from axios
handleClick = (e) => {
e.preventDefault() //
let params = {
username: this.state.username,
password: this.state.password
}
axios.get('/server/data.json', params)
.then((res) => {
if (res.data.success) {
console.log(res.data.errmsg)
//
this.props.history.push('/home')
}
})
}
기본 이벤트를 막았습니다.그리고 성공적으로 뛰어넘었어.구성 요소의 단추button 자체가 페이지에 기본 클릭 이벤트가 있기 때문에, 요청이 들어오면 기본 이벤트를 먼저 진행합니다.그래서 이 묵인 사건을 막아야 합니다.정상적으로 뛰는 거야.
처음으로 완전한react 프로젝트를 만들었는데 다른 해석과 이해가 있으면 큰 놈들이 댓글로 알려주셨으면 좋겠어요.고맙습니다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
NextJS에서 환경 변수(.env) 설정내 환경 변수가 작동하지 않습니다 😱😱😱 이 상황에서 .env 파일을 사용하여 NextJS 앱에서 개발하는 동안 API URL 또는 비밀 키를 숨기고 싶을 수 있습니다. Next.js에서 환경 변수를 어떻게 사용합니...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
