将 API JSON 数据加载到 ReactJs 中的 SyncFusion Shedule答案

【问题标题】：Load API JSON data into SyncFusion Shedule in ReactJs将 API JSON 数据加载到 ReactJs 中的 SyncFusion Shedule
【发布时间】：2020-09-16 21:41:46
【问题描述】：

我在这个项目中使用SyncFusion Schedule。我想从我的 API 端点获取一些数据并将其加载到我的计划中。

API endpoint

问题是我需要一个自定义适配器来告诉计划如何获取数据，而我不知道如何创建一个..

我看到了几个示例，但我仍然无法使自定义适配器正常工作。最糟糕的是，我不知道如何操作数据以放入日程表中。

My Schedule Code

如果您有一些解决问题的建议，请让我知道以更简单的方式或其他库进行安排的任何替代方法。

提前谢谢你。

【问题讨论】：

标签： json reactjs api yii2 syncfusion

【解决方案1】：

为什么不按照前端的要求返回信息呢？您可以通过在模型中重新实现fields方法来修改要返回的数据的结构，或者在返回之前直接在控制器上进行。

【讨论】：

【解决方案2】：

来自 Syncfusion 支持的问候。

我们已经验证了您的要求，并根据您的要求使用以下代码 sn-p 准备了带有自定义适配器的示例。

代码sn-p：

class CustomAdaptor extends ODataV4Adaptor {
  processResponse() {
    let i = 0;
    // calling base class processResponse function
    let original = super.processResponse.apply(this, arguments);
    // adding event id
    original.forEach((item) => item['EventID'] = ++i);
    return original;
  }
}


this.dataManager = new DataManager({
  url: 'https://js.syncfusion.com/demos/ejservices/api/Schedule/LoadData',
  adaptor: new CustomAdaptor
});
this.dataQuery = new Query().from("Events");

示例：https://stackblitz.com/edit/react-custom-adaptor-sample?file=index.js UG：https://ej2.syncfusion.com/react/documentation/schedule/data-binding/#using-custom-adaptor

请参考上面的示例和UG，如果您需要进一步的帮助，请告诉我们。

【讨论】：

我认为这里的问题是我的 API。适配器无法读取数据。是因为我的 XML 格式吗？我需要更多 XML 字段吗？