2017-06-21 5 views
3

Je suis en train de refactoriser un composant React basé sur la classe es6 qui utilise le constructeur normal, puis lie les méthodes et définit les états/attributs dans ce constructeur. Quelque chose comme ceci:Le constructeur est toujours nécessaire dans React avec l'initialisation automatique et les initialiseurs de propriétés

class MySpecialComponent extends React.Component { 
    constructor(props) { 
    super(props) 
    this.state = { thing: true } 
    this.myMethod = this.myMethod.bind(this) 
    this.myAttribute = { amazing: false } 
    } 

    myMethod(e) { 
    this.setState({ thing: e.target.value }) 
    } 
} 

Je veux factoriser cela pour que j'autobinding les fonctions et l'utilisation initializers de propriété pour l'Etat et les attributs. Maintenant, mon code ressemble à ceci:

class MySpecialComponent extends React.Component { 
    state = { thing: true } 
    myAttribute = { amazing: false } 


    myMethod = (e) => { 
    this.setState({ thing: e.target.value }) 
    } 
} 

Ma question est, ai-je encore besoin du constructeur? Ou les accessoires sont-ils également autobronts? Je m'attendais à avoir encore besoin du constructeur et inclus super(props), mais mon code semble fonctionner et je suis confus.

Merci

+3

Si vous ne définissez pas de constructeur, le constructeur parent est automatiquement appelé avec les arguments passés. 'constructor (... args) {super (... args); } 'est essentiellement le constructeur par défaut. –

+0

Si l'état du composant dépend de ses accessoires, vous devez effectuer l'initialisation nécessaire dans le constructeur. Si l'état est le même indépendamment des accessoires, comme c'est le cas dans votre exemple, alors vous êtes bon pour aller avec ce que vous avez écrit. –

+0

Notez que toutes ces choses se produisent encore dans le constructeur, c'est juste une syntaxe différente. Ce qui pourrait être un peu confus. De plus, si vous vouliez initialiser votre instance à partir de valeurs d'arguments, vous auriez toujours besoin d'une définition 'constructor', mais en réaction, il est vrai que tout est jeté dans l'objet' props' de toute façon. – Bergi

Répondre

1

Vous n'avez pas besoin d'un constructeur explicitement défini, sauf si vous avez besoin de faire référence à l'props dans votre objet état initial.

+1

Nous pourrions référencer les 'pops' dans l'état initial sans constructeur, non? Comme: 'state = { loopsRemaining: this.props.maxLoops, }' –