Reactjs FormControl Date - PullRequest
       4

Reactjs FormControl Date

0 голосов
/ 13 января 2020

Я довольно новичок в разработке внешнего интерфейса и сейчас работаю с React. Я пытаюсь использовать поле ввода даты, которое у меня сейчас работает. Я хочу отформатировать поле, ширина и c поля ввода.

Я использую React bootstrap formcontol с типом даты. Как бы я go о форматировании ввода поля даты? Я уверен, что этот вопрос задавался ранее, но, не зная, как это происходит, я не знаю правильный вопрос для поиска. Вы форматируете FormControl или поле ввода? Как вы отличаете guish поле. Et c

function renderForm() {
    return (
      <form onSubmit={handleSubmit}>
        <FormGroup controlId="email" bsSize="large">
          <ControlLabel>Email</ControlLabel>
          <FormControl
            autoFocus
            type="email"
            placeholder="Email Address"
            value={fields.email}
            onChange={handleFieldChange}
          />
        </FormGroup>
        <FormGroup controlId="date" bsSize="large">
          <ControlLabel>Birthday</ControlLabel>
          <FormControl
            type="date"
          />
        </FormGroup>
        <FormGroup controlId="password" bsSize="large">
          <ControlLabel>Password</ControlLabel>
          <FormControl
            type="password"
            placeholder="Password"
            value={fields.password}
            onChange={handleFieldChange}
          />
        </FormGroup>
        <FormGroup controlId="confirmPassword" bsSize="large">
          <ControlLabel>Confirm Password</ControlLabel>
          <FormControl
            type="password"
            placeholder="Confirm Password"
            onChange={handleFieldChange}
            value={fields.confirmPassword}
          />
        </FormGroup>
        <LoaderButton
          block
          type="submit"
          bsSize="large"
          isLoading={isLoading}
          disabled={!validateForm()}
        >
          Signup
        </LoaderButton>
      </form>
    );
  }

Example

Ответы [ 2 ]

0 голосов
/ 13 января 2020

@ radulle

Я попробовал это, но это не сработало. Я не уверен, что это ты имел в виду или нет

<FormGroup controlId="date" bsSize="large">
      <ControlLabel>Birthday</ControlLabel>
      <FormControl
        type="date"
        style={{width:'100%'}}
      />
    </FormGroup>
0 голосов
/ 13 января 2020

Просто добавьте locale: {format: 'DD-MM-YYYY'}, проверьте ссылку для подробностей.

Для части FullWidth попробуйте width: 100% в объекте стилей?

...