My Study/MUI
[MUI] TextField
handbefore
2024. 10. 20. 01:10
TextField 컴포넌트
입력 필드 컴포넌트
여러 형태와 동작을 가진 입력 필드 생성
- label: 입력 필드의 레이블 설정. 사용자에게 입력할 내용에 대한 안내 제공 역할
- fullWidth: 입력 필드를 부모 요소의 가로 폭에 맞게 확장하는지 여부 설정
- value: 입력 필드의 현재 값으로 컴포넌트 상태와 연결되어 동기화
- onChange: 입력값이 변경될 때 호출되는 콜백 함수를 설정. 이벤트 객체를 통해 입력된 값 가져와서 상태 업데이트, 다른 작업수행
- marign: 입력 필드 주위의 여백 설정
사용방법
<TextField
label="가격"
type="number"
fullWidth
value={price}
onChange={handlePriceChange}
margin="normal">
</TextField>