Js div Scroll nach unten in React Komponente

Question

Ich habe ein Problem durch Schreiben der Funktion scrollToBot. Die Funktion würde von componentDidMount und componentDidUpdate aufgerufen werden. Aber das div scrollt nicht. Ich weiß nicht, was in dieser Funktion falsch ist. Muss JQuery diese Funktion implementieren?

Vielen Dank im Voraus.

scrollToBot(){ 
    console.log(this.textAreaDiv.offsetHeight); // 4000 
    if(this.textAreaDiv.offsetHeight>3000){ 
     console.log("should scoll!!!!!!!!!!!!!!"); // showed 
     this.textAreaDiv.scrollTop=2000; 
    } 
    console.log('run scrollTo'); // showed 
} 

componentDidMount(){ 
    this.scrollToBot(); 
} 

componentDidUpdate(){ 
    this.scrollToBot(); 
} 

Answer 1

Dies wird nicht in Reaktion arbeiten, da sie virtuellen DOM verwendet, die wirklichen DOM-Elemente Sie Refs müssen für den Zugriff verwenden, wie in React Documents

Answer 2

In Ihrem JSX verwenden ref beschrieben, um den dom zugreifen Element aus dem Rest Ihrer Reaktionskomponente.

Beispiel:

... 
textAreaDiv: null 

setInputRef(dom){ 
    this.textAreaDiv = dom 
} 

render(){ 
    <div ref={this.setInputRef}/> 
} 

`