익명의 개발노트

로그인화면에서 아이디, 비번이 6글자 이상일 때, 로그인 버튼이 파란색으로 활성화되게끔 바꾸기. 삽질한 내용 1. handleonChange 메서드에 아이디, 비번을 넣었더니, 비번이 7자 이상될때 활성화 됨...한박자 느림.. state ={ isIdPw : false, inputID : "", inputPW : "", } (...중략) handleChange = (e) =>{ this.setState({ [e.target.name] : e.target.value, }) if(this.state.inputID.length >= 6 && this.state.inputPW.length >=6){ setState({ isIdPw : true, }) }else{ setState({ isIdPw : false,..

리액트 이벤트 핸들러 1. 트윗메인화면에 트윗을 입력하고 버튼 누르면 아래에 트윗 리스트 나오게 한다. 2. 트윗메인화면에서 textarea는 TweetRightBox라는 컴포넌트로 불러와서 메인화면에 조립했다. 트윗메인화면 ...(생략) TweetRightBox에서 이벤트값을 props로 넘겨서 트윗메인 화면에서 받은 다음, 이벤트 구현하였다. onChange는 textarea 내에서 값이 변화하면 브라우져가 인식한다. 최종적으로 넘길데이터는 유저이름, 메시지내용, 프로필사진, 트윗생성날짜이다(유저가 정한다.) handleChange =(e) => { this.setState({ username : this.props.username, //다른 컴포넌트에서 값을 불러왔음. inputMessage : e..

state를 다뤄보자. 사용법은 앞에서 배운 props와 비슷하다. state는 props과 다르게 컴포넌트 자신이 지닌 값으로 컴포넌트 내부에서 값을 업데이트 한다. 선언 방식은 두가지!. 1. 생성자를 생성하고 그안에 this.state={ } 이런식으로 만드는 방법 constructor(props){ //Component로부터 상속받아, Coponent의 메소드를 커스템해서 쓰고 싶어서 생성자 생성. super(props); this.state ={ number : 0 } } } 2. 생성자 없이 만드는 방법. (...) state={number:1000} // 생성자 없이 transform-class-속성문법으로 생성자 밖에서 정의가능. render(){ (...) State 값을 업데이트 시 주..