개발

리액트 8일차 : 미니프로젝트

Domaya 2023. 1. 4. 21:33

 

미니 프로젝트를 하게 됐다. 조금 막연하기도 했지만 좋은 기회였던 것 같다!

각자의 방법으로 자신이 좋아하는 햄버거 프랜차이즈를 소개하는 페이지를 만들기로 했다.

 

코딩하면서 겪었던 난관을...

수시로 메모해놔야 하는데 스프링이면 모를까 자바스크립트는 더더욱 산발적으로 발생하는 오류를 일일이 기록하기가 참 번거로운 것 같다. 앞으로는 습관을 들여야지...😢

 

 

리액트 부트스트랩의 Form

https://stackoverflow.com/questions/37239799/can-not-submit-form-react-bootstrap

 

Can not submit form react-bootstrap

I have the following react-bootstrap component: <FormGroup onSubmit={this.gotEmail} role="form"> <FormControl type="text" className="form-control"/> <But...

stackoverflow.com

https://velog.io/@songsong2920/Form-Control

 

Form Control

Form Control

velog.io

 return <form onSubmit={props.handleSubmit}>
         <Form.Control
                as="textarea"
                placeholder="Nickname"
                style={{ height: '10px', width :'200px', marginBottom:'13px'}}
                value={props.nickvalue}
                onChange={handleNickChange}
            />
            <Form.Control
                as="textarea"
                placeholder="Leave a comment here"
                style={{ height: '100px' }}
                value={props.value}
                onChange={handleChange}
            />
            <Button
            variant="primary"
                // className='p-2 text-blue-400 border-2 border-blue-400 rounded hover:text-white hover:bg-blue-200'
                type="submit"
                value="입력"
                style={{ marginTop: '7px', marginBottom:'13px' }}
            >입력</Button>
        </form>

Form.Control태그에 계속 onSubmit을 넣어뒀더니 아무 일도 일어나지 않았었다.

FormGroup does not provide on submit event. You can wrap it with form element and attach event handler to it:

알고보니 FormGroup은 submit event를 지원하지 않는다고 한다. form태그를 위에 감싸줬다.