如何将 this.props.children 传递给 Textarea

Question

我使用 defaultValue 在 textarea 中传递 this.props.childred 但它给了我错误未捕获错误：如果您defaultValue在 a 上提供，请勿传递子项。

还有什么其他选择或者有更好的方法来确定价值观

import React, {Component} from 'react';

class Update extends Component {

    constructor(props){
        super(props);
        this.state = {
            editing:false
        }

        this.renderEdit = this.renderEdit.bind(this)
    }

    edit(){
        this.setState({
            editing:true
        })

    }
    remove(){
        alert("remove")
    }
    save(){
        this.setState({
            editing:false
        })
    }

    renderNormal(){
        return (
            <div className="container">

        <div className="content"> {this.props.children}</div>
        <button onClick={this.edit.bind(this)} className="edit" >Edit </button>
        <button onClick={this.remove} className="remove" >Remove </button>
        </div>
        );

    }
    renderEdit(){

        console.log( 'this.props ', this.props)

console.log( 'this.props.children ', this.props.children)

        return (
        <div className="container">



        <textarea ref="newText" defaultValue={this.props.children} > </textarea>
        <button onClick={this.save.bind(this)} className="edit" >Save </button>
        </div>
        );

    }

    render(){
        var great = "awesome "

        if(this.state.editing){
             return this.renderEdit();
        }else{
            return this.renderNormal();
        }

    }
}
export default Update;

Answer 1

使用这样的自关闭语法：

<textarea ref="newText" defaultValue={this.props.children}/>

或者实际上，您也可以删除标签之间的空格<textarea>。