Question

我有以下组件：

const myComponent = ({handleClick, default = ''}) => (
  <div>
    <textarea name="myTextArea" defaultValue={default}></textarea>
    <button onClick={(myTextArea) => handleClick(myTextArea})}>Done</button>
  </div>
)

调度映射：

 const mapDispatchToProps = (dispatch) => {
   return {
      handleClick: (myTextArea) => {
         console.log(myTextArea); // This is syntheticMouseEvent
      }
    }
  }

myTextArea始终为syntheticMouseEvent

类型

我做错了吗？我的价值在哪里？

Answer 1

您正在获取按钮单击的事件，该事件与文本区域无关。你可以通过几种不同的方式处理事情。一种是实现“受控输入”模式并将文本区域的当前值保持在状态（Redux状态或组件状态）。另一种方法是将“ref”保存到文本区域，并在单击按钮时从真实DOM元素中检索其值。

作为我的React / Redux链接列表的一部分，我在React and Forms上有许多文章的链接，这些文章解释了“受控输入”模式是什么以及如何使用它。

将textarea值发送给redux动作创建者

1 个答案: