Javascript 到达ReactJS返回的数据

它将我在附件中准备的开始和结束日期写入带有

console.log的屏幕；没问题，但是我如何通过
this.setState

我想将写入控制台.log

屏幕的日期转移到

this.setState

。我该怎么做

写入控制台屏幕的日期。我想用

setState

关于代码沙盒

A this.setstat ({
       date: startViewDateComputed
})

因此，我想将写入控制台屏幕的数据传输到控制台屏幕

或者如何从这里获取

startViewDateComputed

date

---

下面是您的解决方案demo.js

import * as React from "react";
import Paper from "@material-ui/core/Paper";
import { Plugin, Getter } from "@devexpress/dx-react-core";
import { ViewState } from "@devexpress/dx-react-scheduler";
import {
  Scheduler,
  WeekView,
  Appointments,
  Toolbar,
  ViewSwitcher,
  MonthView,
  DayView
} from "@devexpress/dx-react-scheduler-material-ui";

import { appointments } from "../../../demo-data/month-appointments";

const pluginDependencies = [
  { name: "DayView", optional: true },
  { name: "MonthView", optional: true },
  { name: "WeekView", optional: true },
  { name: "ViewState", optional: true }
];

// modified this component to accept startViewDateComputed and endViewDateComputed
const IntegratedDates = ({ startViewDateComputed, endViewDateComputed }) => {
  return (
    <Plugin dependencies={pluginDependencies} name="IntegratedDates">
      <Getter name="startViewDate" computed={startViewDateComputed} />
      <Getter name="endViewDate" computed={endViewDateComputed} />
    </Plugin>
  );
};
export default class Demo extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      startDate: null,
      endDate: null
    };
  }

  // added this 
  shouldComponentUpdate(nextProps, nextState) {
    if (
      nextState.startDate === this.state.startDate &&
      nextState.endDate === this.state.endDate
    ) {
      return false;
    }
    return nextProps === this.props && nextState === this.state;
  }

  //moved this inside class
  startViewDateComputed = ({ startViewDate }) => {
    this.setState(prev => ({ startDate: startViewDate }), ()=> console.log(this.state));
    console.log("start view date:", startViewDate);
    return startViewDate;
  };

  //moved this inside class
  endViewDateComputed = ({ endViewDate }) => {
    this.setState(prev => ({ endDate: endViewDate }), ()=> console.log(this.state));
    console.log("end view date:", endViewDate);
    return endViewDate;
  };

  render() {
    return (
      <Paper>
        <Scheduler data={appointments} height={660}>
          <ViewState
            defaultCurrentDate="2018-07-25"
            defaultCurrentViewName="work-week"
          />

          <WeekView startDayHour={10} endDayHour={19} />
          <WeekView
            name="work-week"
            displayName="Work Week"
            excludedDays={[0, 6]}
            startDayHour={9}
            endDayHour={19}
          />
          <MonthView />
          <DayView />

          {/* modified to pass props */}
          <IntegratedDates
            startViewDateComputed={this.startViewDateComputed}
            endViewDateComputed={this.endViewDateComputed}
          />

          <Toolbar />
          <ViewSwitcher />
          <Appointments />
        </Scheduler>
      </Paper>
    );
  }
}

---

请帮帮我，我的朋友。谢谢你的帮助。但是我得到了一个类似下面的错误js:1警告：无法在现有状态转换期间更新（例如在渲染内）。渲染方法应该是道具和状态的纯函数。在TemplateConnectorBase（由AppointsBase创建）中的TemplatePlaceholderBase（由Context.Consumer创建）中的Unknown（由Context.Consumer创建）中的Unknown（由TimeTableAppointLayer创建）中，添加了soln以修复警告，基本上，如果您尝试更新状态，它将再次尝试重新渲染，并可能陷入永无止境的更新和渲染循环，这就是为什么我必须添加shouldComponentUpdate，但如果您通过方法替换对更新状态的调用，而不更新状态，它将消失，我在原始解决方案下面添加了需要更新的部件。您的解决方案非常好。但我通过API和componentDidMount获取数据。但是当shouldComponentUpdate处于活动状态时，API不会提供任何数据

  onEndDateUpdated = (endDate) =>  {
    console.debug ('endDateReceived', endDate);
  }
  onStartDateUpdated = (startDate) => { 
    console.debug('startDate');
  }
  //moved this inside class
  startViewDateComputed = ({ startViewDate }) => {
    this.onStartDateUpdated(startViewDate);
    console.log("start view date:", startViewDate);
    return startViewDate;
  };

  //moved this inside class
  endViewDateComputed = ({ endViewDate }) => {
    this.onEndDateUpdated(endViewDate);
    console.log("end view date:", endViewDate);
    return endViewDate;
  };