Utilizzo reagito con componenti di base - Best Practice
-
21-12-2019 - |
Domanda
Sto pensando di creare un componente reagito per un pulsante qualcosa del genere:
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>
);
}
});
.
e crea anche un componente di 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>
);
}
});
.
e quando richiesto di passare l'estensione come bambino per il pulsante
Qualcuno sa come questo influenzerà la mia esibizione? È una buona pratica per avere così tanti componenti multi strati?
Grazie per le tue idee
Soluzione
influenzerà leggermente le prestazioni, ma non lasciare che ti trattenga dal farlo.È solo un po 'di JavaScript che è gestito, e JavaScript è veloce.
Composizione e astrazioni edilizie Grandi parti del BeniFit React.Scrivi i componenti dell helper ogni volta che renderranno i tuoi altri componenti più facili da capire o cambiare.
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow