Javascript Reactjs，如何获取元素的维度

所以基本上我想要达到的是在组件的返回方法中得到div元素的尺寸。我通过ref获取对此的引用，并希望通过

getBoundingClientRect（）

获取其宽度和高度，但存在错误：

Uncaught TypeError:无法读取未定义的属性“getBoundingClientRect”

。我还尝试了

offsetWidth

和

offsetHeight

这是我的密码：

从“React”导入React；
从“react dom”导入react dom；
从“样式it”导入样式；
var Ink=要求（'react-Ink'）；
从“../FontIcon/FontIcon”导入FontIcon；
var IconButton=React.createClass（{
getInitialState（）{
返回{
iconStyle:this.props.iconStyle，
风格：这个。道具。风格，
游标：{}，
};
},
扩展（obj、src）{
Object.keys（src）.forEach（函数（键）{obj[key]=src[key]；}）；
返回obj；
},
工具提示（）{
变量框=this.refs.button.getBoundingClientRect（），
高度=box.clientHeight，
工具提示样式={
};
返回{this.props.tooltip}；
},
showTooltip（）{
},
removeTooltip（）{
},
render（）{
var_props=this.props，
Tooltip=这个。Tooltip，
选择，
禁用=错误，
RipplePocity，
outterStyleMy={
边界：“无”，
大纲：“无”，
填充：“8px 10px”，
背景颜色：“红色”，
边界半径：100+“%”，
光标：“指针”，
},
iconStyleMy={
字体大小：12+“像素”，
文本装饰：“无”，
textAlign：“居中”，
显示：“flex”，
为内容辩护：“中心”，
对齐项目：“居中”，
},
涟漪风格={
颜色：“rgba（0,0,0,0.5）”，
};
如果（_props.disabled | | _props.disableTouchRipple）{
rippleStyle.opacity=0；
};
如果（禁用道具）{
禁用=真；
};
if（this.state.labelStyle）{
iconStyleMy=this.state.iconStyle；
};
if（this.state.style）{
outterStyleMy=this.state.style；
};
如果（_props.href）{
opts.href=_props.href；
};
var buttonStyle=this.extend（outterStyleMy，iconStyleMy）；
返回(
{`
.IconButton{
位置：相对位置；
}
.IconButton：已禁用{
颜色：${u props.disabledColor}；
}
.btnhref{
文字装饰：无；
}
`}
);
}
});
ReactDOM.render(
,
document.getElementById（'app'）
);在呈现DOM节点之前，无法获取该节点的引用

在
componentDidMount
生命周期方法中执行
this.refs.button.getBoundingClientRect（）
，以确保它已呈现，并且您可以获得对它的引用