React-vis timeline-无法初始化项数据

Question

我有一个关于vis时间线初始化的问题。时间线可见，但没有任何数据。我试图传递不同格式的项目，但它看起来像附件中的图像。这有什么问题呢？我的react组件：

import 'vis-timeline/styles/vis-timeline-graph2d.min.css';
import Timeline from 'react-vis-timeline'

const items = [{
    id: 1,
    start: new Date(2025, 7, 15),
    end: new Date(2025, 8, 2),
    content: 'Test 1',
},
{
    id: 2,
    start: new Date(2025, 7, 17),
    end: new Date(2025, 8, 3),
    content: 'Test 2',
}
];

const options = {
    width: '100%',
    height: '450px',
};

class Timeline2D extends React.Component {

    render() {
        return <Timeline options={options} initialItems={items} />;
    }
}

export default Timeline2D;

Result

Answer 1

要解决此问题，我需要设置组。请参见正确的示例：

import React from 'react';
import 'vis-timeline/styles/vis-timeline-graph2d.min.css';
import Timeline from 'react-vis-timeline'

const items = [{
    id: 1,
    group: 1,
    start: '2014-04-20',
    end: '2014-04-26',
    content: 'Test 1',
},
{
    id: 2,
    group: 2,
    start: '2014-04-22',
    end: '2014-04-29',
    content: 'Test 2',
}
];

const groups = [{
    id: 1,
    content: 'Group 1',
},
{
    id: 2,
    content: 'Group 2',
}
];

const options = {
    width: '100%',
    height: '450px',
};

class Timeline2D extends React.Component {

    render() {
        return <Timeline options={options} initialItems={items} initialGroups={groups}/>;
    }
}

export default Timeline2D;