How get width React Components

Question

How do I get the width of the "g" and the width of the "text" and use it for subsequent calculations

const CustomizedAxisTick: React.FunctionComponent<ICustomTickProps> = ({x,y,payload,width,fill}) => {
        const firstLine = 12
        const secondLine = 24
        const dateTime = payload.value

    return (
        <g transform={`translate(${x},${y})`}>
            <text fontFamily="Roboto, sans-serif" transform={"rotate(-45)"} width={width} height="auto" textAnchor="middle" fontSize={12} fill={fill}>
            </text>
        </g>
    );
}

Answer 1

Try using "ref" for the elements: https://reactjs.org/docs/refs-and-the-dom.html

from the ref you can get the clientHeight / offsetHeight and clientWidth / offsetWidth.