mysql - ReactJS，如何编辑文本区域并在显示数据库中的文本区域时更新值？

Question

我目前正在使用node.js(使用mySQL进行数据库存储)和react.js(显示所有文本区域)

我不太确定如何做到这一点，如果我有一个从数据库给出的文本区域循环，我将如何能够编辑文本区域内的值并能够检索该值以便在我的中更新它当我单击“保存数据”按钮时数据库。

const WorkInProgressHLEDevDays = () =>{
return (
<tr>
<th> TEXTAREAs </th>
{this.state.WIPHLEsData.map((HLEDevDayTextAreas, i) => (
    <td key={i}>
    <textarea className="HLEDevDays"  onChange={this.handleChange} value={HLEDevDayTextAreas.HLEDevDays} spellcheck="false">

    </textarea>
    </td>

))}


</tr>

) }

Answer 1

有多种方法可以实现这一点。最简单的方法是让你的组件不受控制，尽管根据 facebook 的说法，这是最不推荐的一种:

{this.state.WIPHLEsData.map((HLEDevDayTextAreas, i) => (
  <td key={i}>
    <textarea
      name={`HLEDevDays_${i}`}
      className="HLEDevDays"
      defaultValue={HLEDevDayTextAreas.HLEDevDays}
      spellcheck="false"
    />
  </td>
)}

顾名思义，React 并不管理每个文本区域的状态，而是让您的浏览器通过常规 DOM 突变来实现这一点。如果您将整个内容包装在 form 中，您将能够读取后端的值(通过 name 属性)。