Come ottenere il nome del componente genitore in React?

Vorrei fornire piacevoli messaggi di errore per alcuni dei miei componenti, come Reagire fa, ad esempio:Come ottenere il nome del componente genitore in React?

ATTENZIONE: Ogni bambino in un array dovrebbe avere un unico prop “chiave”. Controllare il metodo di rendering di MyComponent. Vedere fb.me/react-warning-keys per ulteriori informazioni.

Questo messaggio fornisce alcune informazioni sul contesto dell'errore. So che posso trovarlo nel debugger, ma voglio rendere il debug più facile per me e per i miei colleghi programmatori.

fonte

2015-04-01 mik01aj

C'è un motivo per cui ti serve questo? Le componenti di reazione agiscono sulle proprietà che ricevono e sul loro stato interno e non sulla gerarchia a cui appartengono. Non sono sicuro che se si stampasse il componente genitore sarebbe di aiuto nel debug, ho creato un componente per la gestione di Promises, – Cristik

. Mi piace, ma ho finito per usarlo praticamente ovunque, quindi mi piacerebbe migliorare la gestione degli errori. – mik01aj

Suppongo che i gestori di promessa siano inviati dal componente principale, se questo è il caso, poiché la maggior parte dei problemi ha origine nei gestori e quelli sono a livello di genitore, sai dove ti trovi. – Cristik

Anche se non è chiaro in che modo devi usare questo con una componente Promise lei ha citato in un commento, si potrebbe provare questo:

var componentName = this.constructor.displayName || this.constructor.name || undefined;

Si ispira this funzione nel codice ReactJS che guarda al costruttore per costruire un nome durante la convalida dell'elemento React.

Ma, se si desidera il nome di un genitore, ciò non è possibile attraverso qualsiasi mezzo documentato e sarebbe probabilmente fragile se si crea codice a seconda di un'implementazione interna specifica. Si tratta di un flusso di informazioni a senso unico in modo che il bambino non abbia bisogno di un collegamento al genitore tramite un'architettura normale.

Se è necessario il nome genitore, è necessario ottenere il valore e passarlo attraverso i bambini che sono sicuro non è desiderabile.

fonte

2015-04-01 18:12:30 WiredPrairie

'this.constructor.displayName' stampa il nome di questo componente (che è bello, ma non quello che volevo, come volevo quello principale), e' constructor.name' è sempre 'Window' per me (molto probabilmente intendevi' this.constructor.name' lì). – mik01aj

Gotcha. Non ho capito cosa volevi che il valore del genitore fosse così come non era descritto nella tua domanda (l'esempio stava mostrando quello che ho fornito). Ho aggiornato la mia risposta per dire che non è possibile utilizzare alcun mezzo supportato. – WiredPrairie

Come ottenere il nome del componente genitore in React?

risposta

Problemi correlati