想在按回车但重新加载时发送消息答案

【问题标题】：Want to send a message when pressing the enter but reloading想在按回车但重新加载时发送消息
【发布时间】：2020-03-23 08:35:27
【问题描述】：

在 React.js 中构建了聊天功能。它可以工作，但是在发送消息时会重新加载页面。最好能够在按下回车时发送聊天，但不应该重新加载。该应用程序如何在不重新加载的情况下通过回车发送消息。

<form>
  <input
    name="chat"
    type="text"
    placeholder="Enter message"
    value={this.state.chat}
    onChange={this.handleChange}
  />
  <button
    onClick={() => this.handleSend(chat)}
  >
    <span>Send</span>
  </button>
</form>

如果我不使用<form />，它将不会被重新加载。但是按回车就不能发消息了。

【问题讨论】：

type 的默认 button 是 submit。您需要选择不同的按钮类型 (button)，或者在您的 revent 处理函数中阻止默认事件操作。
这能回答你的问题吗？ Stop form refreshing page on submit

标签： javascript reactjs

【解决方案1】：

你有两个选择：

1.) 将按钮的类型更改为button，而不是默认的submit。

2.) 在表单提交后使用e.preventDefault() 函数来防止默认的重新加载页面的动作。

【讨论】：

【解决方案2】：

您需要更改按钮的类型而不是提交。或者将默认行为处理为e.preventDefault()

【讨论】：