让用户在反应中通过输入控制换行

Question

我想在用户每次按下输入栏的回车键时，都显示一个换行符。让我给你看这个示例图片。https:/i.stack.imgur.comwyF4R.png

正如你所看到的，用户在输入中写道。

line 1
line 2
line 3
line 4

但我的应用程序并没有把这些内容识别为换行符，而是把所有的内容都显示在一行中，就像输入的上方一样。

这就是我的输入代码的样子。

    <TextField
      label="Description"
      variant="outlined"
      id="desc"
      type="text"
      name="Description"
      value={this.state.desc}
      onChange={(e) => {
        this.setState({ typed: true });
        this.setState({ desc: e.target.value });
      }}
      required
      disabled={this.state.loading}
      multiline
    ></TextField>

我不知道如何显示用户在输入中的每一个换行符 尤其是每一个变化都会被注册为描述状态的值 即使我用regex把换行符替换为br，也只是把br显示为一个字符串而已

Answer 1

对于这一点，你可以使用HTML <textarea> 表单属性，像这样在你的文本输入中，在你的 <TextField /> 组成部分。

<textarea form="usrform" {...props}>{props.value}</textarea>

参考资料 HTML文本框表格 属性.