Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/405.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 回应日历时间表问题_Javascript_Reactjs_Time_Calendar_Timeline - Fatal编程技术网

Javascript 回应日历时间表问题

Javascript 回应日历时间表问题,javascript,reactjs,time,calendar,timeline,Javascript,Reactjs,Time,Calendar,Timeline,我在日程表上遇到了一些问题。我使用此软件包创建日历: https://www.npmjs.com/package/react-calendar-timeline 我的代码: this.state = { items: [], groups: [], componentDidMount() { var self = this; axios .get( `http://localhost/v

我在日程表上遇到了一些问题。我使用此软件包创建日历:

https://www.npmjs.com/package/react-calendar-timeline
我的代码:

    this.state = {

      items: [],
      groups: [],

  componentDidMount() {

    var self = this;     
      axios
        .get(
          `http://localhost/v1/appointments`
        )
        .then(function(res){
           ....

          const itemsArray = items;
          const groupsArray = groups;
          self.setState({
            groups: groupsArray,
            items: itemsArray,
          });

        });



}


        <Timeline
           groups={this.state.groups}
           items={this.state.items}
          defaultTimeStart={moment().subtract(1, 'hour')}
          defaultTimeEnd={moment().add(3, 'hour').add(30, "minute")}
        />

}

我想在日历上的垂直线上显示当前日期

预期产量


我该怎么办?有人告诉我吗

您可以定义自定义时间线标记

import Timeline, {
  TimelineMarkers,
  CustomMarker,
  TodayMarker,
  CursorMarker
} from 'react-calendar-timeline'

const today = new Date()

<Timeline>
  <TimelineMarkers>
    <TodayMarker />
    <CustomMarker date={today} />
    <CustomMarker date={tomorrow}>
      {/* custom renderer for this marker */}
      {({ styles, date }) => {
        const customStyles = {
          ...styles,
          backgroundColor: 'deeppink',
          width: '4px'
        }
        return <div style={customStyles} onClick={someCustomHandler} />
      }}
    </CustomMarker>
    <CursorMarker />
  </TimelineMarkers>
</Timeline>