Отображение символа после значения в TextField

Question

В настоящее время я использую следующий код для Material-UI TextField

<TextField
  id="submissionMark"
  name="submissionMark"
  type="number"
  label="Submission Mark"
  className={classes.textField}
  value={Math.round(this.state.mark)}
  onChange={this.handleChange}
  helperText={this.state.errors.mark}
  error={this.state.errors.mark ? true : false}
  fullWidth
/>

Значением в текстовом поле является число, но я пытаюсь показать % после числа без добавления % до гос.

Я попытался найти решение в API и в Интернете, но не смог ничего найти.

Пример: пользовательский ввод 55 и в текстовом поле отображается 55%

Можно ли отобразить такую ​​вещь?

Answer 1

Просто добавьте % в конце value проп. Таким образом, вам не нужно хранить символ в состоянии.

<TextField
  id="submissionMark"
  name="submissionMark"
  type="number"
  label="Submission Mark"
  className={classes.textField}
  value={`${Math.round(this.state.mark)}%`}
  onChange={this.handleChange}
  helperText={this.state.errors.mark}
  error={this.state.errors.mark ? true : false}
  fullWidth
/>