inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

따라하며 배우는 리액트 A-Z[19버전 반영]

To-Do 앱 만들기 시작

클래스형 컴포넌트에 관한 질문

205

kium

작성한 질문수 80

0

강의 잘 듣고 있습니다.

예전에 강사님 강의 중에 페이팔 결제가 클래스형의 컴포넌트로 카트 페이지에 버튼형식으로 보여져서
버튼을 클릭하면 페이팔 결제가 가능하게 하는 기능이 있었는데 결제금액이 숫자로 되어 있는지등의 결제 전의 검사를 하는 기능을 추가하려고 페이팔 클래스의 생성자에 금액을 체크하는 메소드를 호출하는 식으로 해 봤는데 결제가 되버리더라고요

라이프 사이클에서 생성자가 제일 먼저 호출되니까 생성자에서 뭔가 체크해서 랜더링이 되지 않게 할수 있을줄 알았는데.....
방법이 틀렸는지 아니면 다른 방법이 있는지 조언을 부탁드립니다.

react redux tdd typescript Next.js

답변 1

0

John Ahn

안녕하세요 !! 

제가 예전소스코드를 봤는데 

export default class Paypal extends React.Component {
render() {

 

여기 컴포넌트에 생성자를 만든 다음에 여기 안에서 로직을 작성했다는 건가요?! 

클래스 컴포넌트에서 컴포넌트 시작했을 때 로직을 작성하시려면 componentDidMount(){}에서 해주시면 됩니다 ~ 

생성자에서는 state를 정의하거나 함수를 binding 해주시는 걸로 사용해주시면 됩니다!
감사합니다!

0

kium

말씀하신 컴포넌트의 생성자에서 가격등의 넘어오는 값의 validation check를 하는 메소드를 호출하도록 로직을 작성했습니다. 

그런데 Paypal의 부모 컴포넌트인 카트페이지가 열리면 그냥 실행이 되더라고요
그리고 알려주신 componentDidMount(){}도 카트 페이지가 열리면 실행이 됩니다.

부모 컴포넌트인 카트 페이지에서 페이팔 버튼을 누르면 결제를 하기전에 값을 검사를 할수 있는 방법이 있으면 조언 부탁 드릴께요

강의 소스 코드 압축 풀기 오류

0

92

1

런타임 에러 ㅠㅠ

0

105

1

강의대로 따라갔는데 에러보다 api키로 들어간 넷플릭스? 그런게 렌더링 되지 않습니다 ㅠ

0

114

1

안녕하세요 개발과 상관없는 질문입니다만

0

123

1

리액트 라우터 관련

0

119

1

react-beatiful-dnd에서 문제가 발생합니다.

0

108

1

react19에서는 react-beautiful-dnd가 설치되지 않습니다.

0

833

1

useEffect로 사용을 해도 되나요?

0

210

1

넷플릭스 오리지널 제외하고 슬라이드가 동작을 안합니다.

0

202

1

react 19의 useActionState가 더이상 isPending은 지원하지 않는 듯합니다

0

287

2

리액트 dockderfile 작성 시 COPY 질문

0

156

1

next.js에서부터는 react query 필요없는지

0

328

1

기능

0

204

1

오류가 안보여요

0

206

1

CSS

0

225

1

local storage

0

224

1

list컴포넌트 생성하기

0

230

1

검색어 입력 후 초기화하는 방법 궁금합니다!

0

343

1

Banner.css에 대해서

0

464

1

플러그인이 추천을 안해줍니다

0

334

1

마이너스버튼 테스트

0

285

2

리액트 서버 실행 오류

0

1169

2

오류메세지는 확인했는데 어떻게 고쳐야 할지 모르겠습니다 ㅠ

0

307

1

creactStore질문이요

1

293

2