React:RefObject
Ref는 render 메서드에서 생성된 DOM 노드나 React 엘리먼트에 접근하는 방법을 제공합니다.
Examples
import * as React from 'react';
import {
ChargingGraph as _ChargingGraph,
ChargingGraphOptions as _ChargingGraphOptions,
ChargingWork,
} from '@steel/charging/dist';
export interface ChargingGraphOptions {
work?: ChargingWork;
prevWork?: ChargingWork;
options?: _ChargingGraphOptions;
}
export default class ChargingGraph extends React.Component<ChargingGraphOptions> {
_rootDiv: React.RefObject<HTMLDivElement>;
_graph?: _ChargingGraph;
constructor(props: ChargingGraphOptions) {
super(props);
this._rootDiv = React.createRef<HTMLDivElement>();
}
componentDidMount() {
if (this._graph) {
return;
}
const div = this._rootDiv.current!;
const options = this.props.options ?? {};
const work = this.props.work ?? ({} as ChargingWork);
const prevWork = this.props.prevWork ?? ({} as ChargingWork);
this._graph = new _ChargingGraph(div, options);
this._graph.work = work;
this._graph.prevWork = prevWork;
this._graph.draw();
}
get graph() {
return this._graph!;
}
draw() {
this.graph.draw();
}
render() {
return <div ref={this._rootDiv}></div>;
}
}