Как я могу выровнять текст TextField Material-ui по центру, а также установить минимальное значение числа?

Question

Я пытаюсь выровнять текст по центру и установить минимальное значение в 0. Но этого не происходит.Я могу сделать либо или, но не оба одновременно.Я посмотрел на страницу материала-интерфейса в TextField, но это не помогло -> здесь

<TextField type="number" 
    id={cells.id} 
    inputProps={{min: 0}} 
    InputProps={classes.inputText}  
    className={classes.inputComponent} 
    disabled={cells.disabled} 
    defaultValue={cells.text} />

Мне нужно установить стиль для самого текстового поля и стиль для текставнутри.

inputComponent: {
    height: '30px',
    width:  '71px',
    border: '1px solid #D3D4D0',
    borderRadius: '5px',
    backgroundColor: '#FFFFFF',
    boxShadow: '0 1px 0 0 rgba(170,170,170,0.01)'
}

inputText: {
    color: 'rgba(0,0,0,0.87)',
    fontSize: '16px',
    letterSpacing: '0.5px',
    lineHeight: '28px',
    textAlign: 'center',
}

Answer 1

Немного измените JSX:

<TextField type="number" 
    id={cells.id} 
    inputProps={{min: 0, style: { textAlign: 'center' }}} // the change is here
    InputProps={classes.inputText}  
    className={classes.inputComponent} 
    disabled={cells.disabled} 
    defaultValue={cells.text} />

Причина

InputStyle больше не является частью API.

Вам необходимоиспользуйте его как style: {} внутри inputProps так же, как InputStyle раньше.