Textarea一样，但只有一行

Question

我喜欢textarea元素的东西是允许自动拼写检查。输入文本元素不会发生这种情况。我需要一个像textarea这样的元素，它只显示一行，即使用户按下回车也不会转到下一行。我尝试了row ='1'但是如果用户按下输入内容移动到下一行则无关紧要。这也可以是反应组件。存在这样的东西？

Answer 1

像这样：

document.querySelector('textarea').addEventListener('keydown', (e) => {
  if (e.keyCode === 13) e.preventDefault();
});

textarea {
  white-space: nowrap;
  overflow:hidden;
}

<textarea rows="1"></textarea>

Answer 2

正如您的问题标记为ReactJS

import React from 'react';

class App extends React.Component {

  handleTextArea = (e) =>{
    let lineCount = 0;
    if (e.keyCode == 13) {
      lineCount++;
    }
    if (lineCount >= 1) { // set here how may lines you want
      e.preventDefault();
      return false;
    }
  }
  render() {
    return (
        <div>
        <textarea onKeyDown={this.handleTextArea}>only one line</textarea>
        </div>
    )
  }
}
export default App