Блог

Главная - Вопросы по программированию - Создание текстового поля, отображающего динамическое значение в зависимости от определенных условий?

Создание текстового поля, отображающего динамическое значение в зависимости от определенных условий?

#reactjs

Вопрос:

Я хочу создать динамическое текстовое поле. текстовое поле, которое может принимать обычный ввод, если пользователь выбирает элемент из основной группы опций, и если пользователь выбирает вторичную группу, Текстовое поле должно получить предварительно отсортированное значение, поэтому в других мирах текстовое поле должно служить 2 целям: обычный ввод и предварительно установленный ввод в зависимости от каждого выбора, я не уверен, возможно ли это.Моя текущая проблема заключается в том, что входное значение блокируется, если я использую условный рендеринг.

 <form className={classes.root} noValidate autoComplete="off">
      <div>
        <NativeSelect
          className={classes.select}
          value={select.select}
          name="excercises"
          onChange={handleSelect}
        >
          <option value="" disabled hidden>
            Choose an Item
          </option>
          <optgroup label={"Primary"}>
            <option key={1}>a</option>
            <option key={2}>b</option>
          </optgroup>
          <optgroup label={"Secondary"}>
            <option key={3}>c</option>
            <option key={4}>d</option>
          </optgroup>
        </NativeSelect>

        <TextField
          className={classes.textField}
          label="number"
          //value={select.custom ?? "100"}
          name="num"
          onChange={handleChange}
          autoComplete="off"
        />
      </div>
    </form>

CodeSandbox

Метки: ,