如何获取反应元素的宽度

Question

我试图创建一个范围输入，在滑块拇指正上方显示一个工具提示。

我在网上浏览了一些香草 JS 示例，似乎我需要有元素的宽度才能完成它。

所以我只是想知道如何获得元素宽度？

几乎相当于 JQuery 方法 $(element).width()

原文由 Rick Enciso 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

    class MyComponent extends Component {
      constructor(props){
        super(props)
        this.myInput = React.createRef()
      }

      componentDidMount () {
        console.log(this.myInput.current.offsetWidth)
      }

      render () {
        return (
        // new way - as of React@16.3
        <div ref={this.myInput}>some elem</div>
        // legacy way
        // <div ref={(ref) => this.myInput = ref}>some elem</div>
        )
      }
    }

原文由 Rick Enciso 发布，翻译遵循 CC BY-SA 4.0 许可协议