REACT

[생활코딩] create 구현 : mode 변경 기능

worri-pi 2022. 2. 1. 13:55

 

 

생활 코딩 https://www.youtube.com/watch?v=MDGFEV_idSY 

 

 

 

Control.js 파일을 만들고 App.js 에 load 한다.

Control component에 onChangeMode 이벤트를 정의하고 event handler를 추가한다.

<Control onChangeMode={function(_mode){
	this.setState({
		mode:_mode
	})
	}.bind(this)}>
</Control>

그리고 Control.js 에서 각 버튼을 클릭했을 때 onChangeMode event handler가 작동될 수 있도록 onClick을 추가해준다.

import React,{Component} from 'react';

class Control extends Component{
    render(){
      return (
        <ul>
          <li><a href="/create" onClick={function(e){
            e.preventDefault();
            this.props.onChangeMode('create');
          }.bind(this)}>create</a></li>
          <li><a href="/update" onClick={function(e){
            e.preventDefault();
            this.props.onChangeMode('update');
          }.bind(this)}>update</a></li>
          <li><input onClick={function(e){
            e.preventDefault();
            this.props.onChangeMode('delete');
          }.bind(this)} type="button" value="delete"></input></li>
        </ul>
    );
    }
  }
export default Control;
728x90