语义TextArea无法使用初始文本进行编辑

时间:2019-03-01 07:09:41

标签: reactjs semantic-ui semantic-ui-react

反应语义-TextArea

我有初始值 它显示在textArea中,但无法再编辑。

有解决方案吗?

codepen示例:

[1]: https://codepen.io/as3script/pen/VRepqv?editors=1010

1 个答案:

答案 0 :(得分:1)

您可以为此目的使用

    const { 
      TextArea,
    } = semanticUIReact

    class App extends React.Component {
      constructor(props){
        super(props);
        this.state={
          value: "initial text which I would like to edit" // set initial state
        }
      }

      onChange(e){
        this.setState({ value: e.target.value })
      }

      render() {
        const { value } = this.state;

        return (
          <div>
            <TextArea 
               rows={4} 
               style={{'width': '550'}} 
               onChange={(e) => this.onChange(e)} 
               value={value} //render changed state
             /> 
          </div>
        )
      }
    }

    // ----------------------------------------
    // Render to DOM
    // ----------------------------------------
    const mountNode = document.createElement('div')
    document.body.appendChild(mountNode)

    ReactDOM.render(<App />, mountNode)