物料界面TextField多行，仅当按Shift Enter键时才换行

Question

我有一个反应内置的聊天系统，我正在使用材料UI文本字段来提交消息。我希望它的功能类似于网页版的whatsapp或电报。按enter键发送消息，但在shift enter键上，创建新行。我有这个

             <TextField
                autoFocus={true}
                color={"primary"}
                multiline
                rowsMax={4}
                value={inputValue}
                fullWidth
                placeholder={"Please enter a message"}
                onChange={e => {
                  setInputValue(e.target.value);
                }}
              />

我应该添加什么来获得该功能，它容易吗？

Answer 1

在你的TextField中添加onKeyDown属性

onKeyDown={(e) => {
  if(e.keyCode === 13 && !e.shiftKey) {
    e.preventDefault();
    setInputValue("");
  }
}}