React Material UI Многострочное текстовое поле OnSubmit не срабатывает

Question

Я пытаюсь создать текстовое поле ввода, подобное стилю Slack. Где вы можете сделать Ctrl + Введите, чтобы сделать новую строку и . Введите. Возможно ли это с текстовым полем пользовательского интерфейса материала или даже с материальным интерфейсом?

Спасибо!

Answer 1

Вы можете использовать текстовое поле материала-ui, по умолчанию оно предоставляет только одну строку в поле ввода, но вы также можете перейти к многострочной установке, установив bool multiLine={true}.

В случае многострочного Ctrl + Enter будет работать, как вы хотите. Что-то вроде этого:

<TextField 
    hintText="MultiLine with rows: 2 and rowsMax: 4" 
    multiLine={true} 
    rows={2} 
    rowsMax={4} 
/> 

Чтобы добавить дополнительную настройку, вы также можете указать строки и максимальные строки. Введите функциональность вы можете достичь в OnChange событие, путем проверки ключа код ввода ключа, как это:

onChange(event, value){ 
    if(event.keyCode == 13){ 
     //put the logic here 
    } 

проверить все свойства и характеристики: http://www.material-ui.com/#/components/text-field