小编mat*_*t93的帖子

所以我一直在 iOS 上努力解决这个问题：我想要一个允许添加新行的多行文本输入：

// Now there's a "return" button, that adds a new line, perfect!

<TextInput
  multiline
  numberOfLines={2}
/>

同时，我想要一个带有返回键的多行文本输入，它会关闭键盘（这样用户就可以继续向下滚动屏幕到提交 CTA）：

// Now there's a "done" button, that dismisses the keyboard, yay!

<TextInput
  blurOnSubmit
  multiline
  numberOfLines={2}
  returnKeyType="done"
/>

但是，我找不到如何将这两者结合起来的方法。对于其他键盘类型（例如number ），键盘上方有returnKey 。

有没有办法同时使用新行按钮和键盘关闭键进行多行文本输入？谢谢！

编辑：

世博小吃：https://snack.expo.io/@mattz/77a2d1

在下面的几行中,我将描述如何创建更清晰和抽象的方法来管理(不仅仅是)我的代码中的onChange处理.

后来我遇到了这种模式:

class A extends React.Component {
  constructor(props) {...}

  handleText1Change = (e) =>
    this.setState(prevState => ({
      text1: e.target.value
    }))

  handleText2Change = (e) =>
    this.setState(prevState => ({
      text2: e.target.value
    }))

  render() {
    return (
      <div>
        <input
          type="text"
          onChange={this.handleText1Change}
        />
        <input
          type="text"
          onChange={this.handleText2Change}
        />
      </div>
    )
  }
}

在组件中为每个输入编写处理函数非常烦人,它大致违反了DRY原则(不要重复自己).所以我重构了它并获得了以下内容:

class A extends React.Component {
  constructor(props) {...}

  handleInputChange = (value, property) =>
    this.setState(prevState => ({
      [property]: value
    }))

  render() {
    return (
      <div>
        <input
          type="text"
          onChange={e => this.handleInputChange(e.target.value, 'text1')}
        />
        <input …