본문 바로가기

728x90

props

(4)

[Fast Campus , React] 7. TicTacToe 앱 만들기 (3) - super / props & state 자바스크립트에서 super 자식 클래스 내에서 부모 클래스의 생성자를 호출할 때 사용된다 자식클래스 내에서 부모클래스의 메서드를 호출할 때 사용된다. super([인자값]); // 부모 생성자 호출 super.functionOnParent([인자값]); super이후에 this 키워드 생성자에선 super키워드 하나만 사용되거나, this키워드가 사용되기 전에 호출되어야 한다 super이후에 this가 나와야 하는 이유 부모클래스의 생성자를 호출하기 전 this. 변숫값을 사용하려 하면 문제 발생 React에서 this.state를 생성자에서 정의할 때 super가 먼저 와야 하는 것도 같은 이유 React에서 super에 props를 인자로 전달해야 하는 이유 React.Component객체가 생성될 ..

[Fast Campus , React] 6. TicTacToe 앱 만들기 (2) - props, state Pros를 통해 컴포넌트 간에 데이터를 전달하기 Props : Properties의 줄임말 Props는 상속하는 부모 컴포넌트로부터 자녀 컴포넌트에 데이터 등을 전달하는 방법 읽기 전용 (immutable)으로 자녀 컴포넌트 입장에선 변하지 않는다 (변하게 하고자 하면 부모 컴포넌트에서 state를 변경시켜줘야 한다 1. 상위 컴포넌트가 임의이 이름으로 (여기선 value) props 설정하고 하위 컴포넌트에 값 설정 export default class Board extends Component { renderSquare(i) { return } render() { const status = "Next Player: X"; return ( {status} {this.renderSquare(0)} {th..

Coding Apple, React 강좌 내용 정리.9 - 쇼핑몰 비슷하게 만들어 보기.2 - import / export import / export 전 강의 내용에 이어서 진행 (링크) 외부의 데이터 (data.js / export) -> import해서 사용하는 정보 데이터 만들기 - src 폴더에 파일 생성 (data.js) 후 export default 적는다 // data.js 내용 export default [ { id : 1, title : "White and Black", content : "Born in Newyork" , price : 120000 }, { id : 2, title : "Red Knit", content : "Born in Seoul" , price : 110000 }, { id : 3, title : "Back", content : "Born in Paris" , price : 10000..

Coding Apple, React 강좌 내용 정리.7 - UI 제작패턴 (props 등 이용) UI 만드는 법 UI와 관련된 중요 정보들을 state로 저장해놓고 state에 따라서 UI가 수정되게 만든다 저번 내용 참조 React 강좌 내용 정리.5 - Component 기초, 사용하기 (기본 소스 포함) React 강좌 내용 정리.6 - map, for / props 목표 * 각 list의 제목을 클릭하면, Modal의 타이틀 변경해서 보여주기 1. 기본적인 내용을 state로 선언 function App() { // 글제목 state let [글제목, 글제목변경] = useState(['남자코트 추천', '강남 우동맛집', '파이썬독학']); // 누른제목의 index 번호를 저장하는 state let [누른제목,누른제목변경] = useState(0) 2. 글목록 관련된 내용 { // i :..

이전 1 다음

티스토리툴바