React Material UI Multiline Textfield OnSubmit不会触发

Question

我试图设计一个类似于Slack风格的文本输入框。你可以在哪里做Ctrl + 输入做一个换行和输入提交。材质用户界面文本字段，甚至材质用户界面都可行吗？

谢谢！

Answer 1

您可以使用material-ui的文本字段，默认情况下，它只在输入字段中提供一行，但也可以通过设置bool multiLine={true}扩展到多行。

在多行的情况下Ctrl + 输入将按您的要求工作。类似这样的：

<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