Ist ReactDOM.findDOMNode in diesem Fall erforderlich?

Question

Ich habe nächsten Code von hier genommen: https://www.meteor.com/tutorials/react/adding-user-accounts.
Kann ich in diesem speziellen Fall
ReactDOM.findDOMNode(this.refs.container)) mit
this.refs.container
ohne versteckte Fehler in Zukunft ersetzen?

.... 
export default class AccountsUIWrapper extends Component { 
    componentDidMount() { 
    // Use Meteor Blaze to render login buttons 
    this.view = Blaze.render(Template.loginButtons, 
     this.container); 
    } 
    .... 
    render() { 
    // Just render a placeholder container that will be filled in 
    return <span ref={(node) => (this.container = node) />; 
    } 
} 

Answer 1

Wie in der Dokumentation Refs vorgeschlagen

reagieren Wenn Sie vor dem Reagieren mit gearbeitet, könnten Sie mit einem älteren vertraut sein:

import React, { Component } from 'react'; 
import ReactDOM from 'react-dom'; 
import { Template } from 'meteor/templating'; 
import { Blaze } from 'meteor/blaze'; 

export default class AccountsUIWrapper extends Component { 
    componentDidMount() { 
    // Use Meteor Blaze to render login buttons 
    this.view = Blaze.render(Template.loginButtons, 
     ReactDOM.findDOMNode(this.refs.container)); 
    } 
    componentWillUnmount() { 
    // Clean up Blaze view 
    Blaze.remove(this.view); 
    } 
    render() { 
    // Just render a placeholder container that will be filled in 
    return <span ref="container" />; 
    } 
} 

Oder vielleicht sogar mit Callback-Funktion ändern API, bei der das ref-Attribut eine Zeichenfolge ist, wie "textInput", und auf den Knoten DOM wird als this.refs.textInput zugegriffen. Wir raten davon ab, da Zeichenkettenreferenzen einige Probleme haben, als veraltet gelten und wahrscheinlich in einer der zukünftigen Versionen entfernt werden. Wenn Sie derzeit this.refs.textInput verwenden, um auf Refs zuzugreifen, empfehlen wir stattdessen das Callback-Muster .

Daher ref callback ist der richtige Weg zu gehen, wenn Sie die künftige Unterstützung

export default class AccountsUIWrapper extends Component { 
    componentDidMount() { 

    this.view = Blaze.render(Template.loginButtons, 
     this.container); 
    } 
    .... 
    render() { 

    return <span ref={(node) => (this.container = node) />; 
    } 
}