I encountered an issue while trying to utilize the Gantt chart feature from the Dhtmlx library in TypeScript. The problem seems to stem from an error during the initialization of gantt. How can I go about resolving this? Below is the relevant code snippet:
import React from 'react';
import { gantt } from 'dhtmlx-gantt';
import 'dhtmlx-gantt/codebase/dhtmlxgantt.css';
import VayuModule, { VayuModuleState } from '../../../VayuModule';
import './Gantt.scss';
export interface GanttState extends VayuModuleState {}
class Gantt extends VayuModule<any, GanttState> {
Gantt: any;
public render(): JSX.Element {
return <div className="Gantt-container"></div>;
}
protected getDefaultState(): GanttState {
return {};
}
componentDidMount() {
const { tasks } = this.props;
gantt.init(this.ganttContainer);
gantt.parse(tasks);
}Here is the specific error message:
Property 'ganttContainer' does not exist on type 'Gantt'. TS2339
19 | componentDidMount() {
20 | const { tasks } = this.props;
21 | gantt.init(this.ganttContainer);
| ^
22 | gantt.parse(tasks);