MUI에서는 입력과폼을 작성하기 위한 TextField?

MUI에서는 입력과폼을 작성하기 위한 TextField?

어쩌면 이것은 기본적인 질문일 수도 있지만, 아직까지는 어떠한 합리적인 설명도 찾지 못했다.저는 최근에 MUI를 사용하여 리액션하는 초보자입니다.인풋을 사용하는 타이밍과 Textfield폼을 만드는 데 사용할 수 있나요?

문서를 보니까...TextField의 슈퍼셋입니다.Input할 수는 있지만 확실하진 않아요.MUI 사이트에서는 다음 예를 사용합니다.TextField그리고.Input둘 다, 둘 다 다른 것에 대한 이점 및 사용 사례를 명시하지 않습니다.

제안해 주세요.

대부분의 사용 예에서는TextField위임하는 하위 컴포넌트(예:Input).

이 문서의 관련 부분은 여기에 있습니다.

특히 다음 행:

TextField는 작은 컴포넌트(FormControl, Input, FilenInput, InputLabel, 개요)로 구성됩니다.입력 및 FormHelperText )를 사용하여 폼 입력을 대폭 맞춤화할 수 있습니다.

이러한 하위 수준 구성 요소를 사용하는 주된 이유는 양식 입력을 사용자 정의해야 하는 경우입니다.TextField.

컴포넌트의 간단한 정의는 다음과 같습니다.

<FormControl {...other}>
  {label && (
    <InputLabel {...InputLabelProps}>
      {label}
    </InputLabel>
  )}

  {select ? (
    <Select {...SelectProps}>
      {children}
    </Select>
  ) : (
    <Input {...InputProps} />
  )}

  {helperText && (
    <FormHelperText {...FormHelperTextProps}>
      {helperText}
    </FormHelperText>
  )}
</FormControl>

보다시피TextField그 이상이다.Input구성 요소는 다음과 같습니다.

• FormControl: 콘텍스트프로바이더에 의한 패스일 뿐입니다.TextField상태(오류, 오류, 호버...)를 아이들에게 전달하고 일관성을 유지하도록 합니다.일반적으로 이 구성 요소를 직접 사용할 필요가 없습니다.

• InputLabel: 의 라벨TextField,Input그 자체에는 없습니다.따라서 라벨을 붙이고 싶다면Input,사용하다TextField.

• FormHelperText: 도우미의 텍스트는Input, 를 나타내는 데 사용됩니다.TextField또는 일부 오류 메시지를 형식 검증으로 표시합니다.

• Input: 입력 자체.실제로는 다른 종류의 3개의 입력 컴포넌트가 있습니다.Input,OutlinedInput그리고.FilledInput의 받침대에 의해 설정될 수 있습니다.TextField이것은 또 다른 이유 중 하나입니다.TextField다른 입력 컴포넌트를 검색하여 Import하는 대신 배리언트프로포넌트를 설정하여TextField무엇을 렌더링해야 할지 알 수 있습니다.

• Select:TextField둘 중 하나일 수 있다Select또는Input. 입력 유형을 선택하도록 프로펠러를 설정합니다.

사용 시기TextField? 를 표시하는 폼으로Input라벨을 사용하여 오류 메시지를 클린 API로 설정할 수 있습니다.대부분의 경우입니다.

「 」를 Input입력하기 위한 것을 제외하고 위의 모든 것이 필요하지 않은 경우 또는 극단적인 커스터마이즈와 API가 필요한 경우TextField충분하지 않아요.

언급URL : https://stackoverflow.com/questions/56122219/in-mui-when-do-we-use-input-vs-textfield-for-building-a-form