reactjs - 如何使具有默认值的语义 UI TextArea react ，但仍允许用户更改值？

Question

我试过在 TextArea 中使用默认值和值，但它不允许用户更改值。

textarea的父div是redux-form字段。并尝试将存储在 redux state 中的值传递给 textarea

     <Field
        name="message"
        component={renderField}
        ...
        onChange={ (e: any) => 
          triggerHoldResponse(e.target.value, conversation.id)
        }
      />

const renderField = ({input, type, meta: { error }}: any) => (
  <div>
    <TextArea 
      className={styles.textarea}
      {...input}
      placeholder={placeholder}
      type={type}
    />
    <div className={styles.errorSignal}>
      {error}
    </div> 
  </div>
);

Answer 1

SUI TextArea是 Form.TextArea 的基类，两者都使用相同的属性 value 来设置 textarea 的默认文本值。

以下代码对我有用:

import React from 'react'
import { Form, Input, TextArea, Button } from 'semantic-ui-react'

const FormTextAreaExample = () => (
  <Form
    <Form.TextArea
      autoHeight
      onChange={this.handleMessageChange}
      label="Message"
      value={mesg}
      placeholder="Enter your request message"
      rows={3}
    />

  </Form>
)

export default FormTextAreaExample;

其中 value={mesg}，设置 textarea 的默认状态(已设置)。