У меня есть классовый компонент, в нем мне нужно получить дом элемент, но всегда когда я это делаю через ref, то получаю null. В чем моя ошибка?
Для начала я в конструкторе объявляю ref:
constructor(props) {
this.place = React.createRef();
}
Далее то место, где мне нужно получить доступ до элемента.
componentDidMount = (): void => {
const scrPlace = this.place.current
console.log('scrPlace',scrPlace);
if (scrPlace && this.prevScrollpos) {
scrPlace.addEventListener("scroll",() => {
const currentScrollPos = window.pageYOffset;
console.log("currentScrollPos",currentScrollPos);
if (this.prevScrollpos > currentScrollPos) {
document.getElementById("t_rates")!.style.top = "0";
} else {
document.getElementById("t_rates")!.style.top = "-50px";
}
this.prevScrollpos = currentScrollPos;
})
}
}
И дальше сам ref на дом элемент:
<div className="scrolling_place" ref={this.place}>
<Content
makeScreenshot={this.makeScreenshot}
toggleSelectedAccount={this.toggleSelectedAccount}
getAccounts={this.getAccounts}
setError={this.setError}
forexRates={forexRates}
accounts={accounts}
currentAccount={accounts[selectedAccountNum]}
userData={userData}
comissions={comissions}
offers={offers}
adDepth={adDepth}
offerChangeInBotActive={this.offerChangeInBotActive}
offerChangeOnP2PActive={this.offerChangeOnP2PActive}
updateOfferSetting={this.updateOfferSetting}
updateOfferSettings={this.updateOfferSettings}
updateOfferExchangeData={this.updateOfferExchangeData}
setDepthGetted={(id: string, exchange: string) =>
this.setDepthGetted(id, exchange)
}
needToGetDepth={needToGetDepth}
hasCompetitorSettingsAccess={
hasCompetitorSettingsAccess
}
/>
<Footer />
</div>