en utilisant réagir avec les composants de base - Meilleure pratique

Question

Je pense à créer un composant réactif pour une touche quelque chose comme ceci:

var Button = React.createClass({
    getDefaultProps: function() {
        return {
            classString: '',
            disabled:'',
            text:'',
            link:'',
            onPropagateClick: function(){}
        };
    },
    handleClick: function () {
        this.props.onPropagateClick(this.props.link);
    },
    render: function () {
        return (
            <button className={this.props.classString} onClick={this.handleClick} disabled={this.props.disabled} >
                {(React.Children.count(this.props.children) === 0) ? this.props.text : this.props.children}
            </button>
        );
    }
}); 

et créer également un composant span:

var Span = React.createClass({
    getDefaultProps: function() {
        return {
            classString: '',
            text:''
        };
    },
    render: function () {
        console.log(this.props);
        return (
                <span className={this.props.classString}>
                    {this.props.text}
                </span>
            );
    }
});

et lorsque cela est nécessaire pour passer de l'espace comme enfant pour le bouton

Est-ce que quelqu'un sait comment cela affectera mes performances? Est-ce une bonne pratique d'avoir autant de composants multiples multiples?

merci pour vos idées

Answer 1

Cela affectera légèrement les performances, mais ne vous laisserez pas vous retenir de le faire.C'est juste un peu de JavaScript qui est couru et JavaScript est rapide.

Composition et immeubles d'abstractions Grandes parties du bénifi-réact.Écrivez des composants assistant chaque fois qu'ils permettront de rendre vos autres composants plus faciles à comprendre ou à changer.