js怎么获取一个单位为rem的元素真实宽/高度？

前言

刚写一个小Demo，遇到了一个很棘手的问题。

由于移动端需要自适应布局，所以我采取了 rem 为单位的方式进行自适应布局。

写的过程中遇到一个需求：在页面加载完成后需要获取一个元素的真实宽度

如：

 componentDidMount() {  // react 生命周期函数，在第一次渲染后调用
    let navItemDom = document.querySelector('.nav-item');
    console.log('当前元素的 offsetWidth 宽度：' + navItemDom.offsetWidth)
  } 

问题出现了：明明元素的宽度显示的是 80 ，为什么打印出来是 40 ， 这是个什么鬼？

哎，烦躁。上个厕所先~

灵光乍现，会不会跟我设置 html fontSize 的这个方法有关系，赶紧回来，打印一波~

完犊子，为什么是先获取宽度才设置的 fontSize 。调整一波~  

OK了~   获取宽度成功了

总结

获取单位为rem的元素宽度/高度，要注意生命周期的问题，一定要先设置完根节点 fontSize 以后再获取元素的真实宽度/高度