Реагировать на родной реквизит машинописи

Question

Это правильный путь для передачи интерфейса? Если нет, пожалуйста, ведите меня. Спасибо!

Это мой интерфейс

export interface Props {
  username: string;
  password: string;
  usernameTouched: boolean;
  passwordTouched: boolean;
}

Это часть, которую я хочу знать, хорошо это или нет

export const Login: React.FC<Props> = (props) => {
  const [user, setUser] = useState<props.username>('');
  const [pass, setPass] = useState<props.password>('');
  const [userTouch, setUserTouch] = useState<props.usernameTouched>(false);
  const [passTouch, setPassTouch] = useState<props.passwordTouched>(false);

  const handleUsername = (username: string) => {
    setUser(username);
  };

  const handlePassword = (password: string) => {
    setPass(password);
  };

  const handleUserBlur = () => {
    setUserTouch(true);
  };

  const handlePassBlur = () => {
    setPassTouch(true)
  };

  const userError = !user && userTouch ? strings.username_required : undefined;

  const passError = !pass && passTouch ? strings.password_required : undefined;

  return (
    <KeyboardAvoidingView style={styles.container} behavior="padding">
      <Logo label="Fitness" style={styles.imageLogo} />
      <View style={styles.form}>
        <TextField
          onChangeText={handleUsername}
          value={user}
          placeholder={strings.user_placeholder}
          returnKeyType="next"
          onBlur={handleUserBlur}
          error={userError}
        />
        <TextField
          onChangeText={handlePassword}
          value={pass}
          placeholder={strings.pass_placeholder}
          returnKeyType="done"
          secureTextEntry={true}
          onBlur={handlePassBlur}
          error={passError}
        />
      </View>
    </KeyboardAvoidingView>
  );
}

Это работает Кстати, я просто хочу уточнить, хорошо это или нет, если нет, пожалуйста, помогите мне, спасибо!

Answer 1

Вы можете просто использовать:

export const Login = (props: Props) => {...}