如何訪問React組件中渲染的元素文本？

Question

我有一個側邊欄，CSS在渲染時限制字符串的寬度。我如何訪問最終的渲染字符串來區分我的原始道具和渲染的字符串？

我想在componentDidMount這個，我可以訪問的所有東西都是原始的完整字符串。

此元素沒有#id，因此無法訪問該元素。

Answer 1

您可以將ref添加到節點，然後使用它來訪問內部HTML屬性。

componentDidMount() { 
    const text = this.sidebar.innerHTML 
} 
render() { 
    return (
    <div ref={sidebar => {this.sidebar = sidebar}}>Some text here</div> 
) 
}