在 SPFx Web 部件中重构休息请求

Question

我曾在一个 Web 部件中工作，该部件从 SP 列表中获取项目，然后对这些结果进行筛选或分组。对于每个筛选器操作，我使用 Rest 向 SP 发送一个新请求，我正在使用其余代码取回筛选的项目并将它们显示在 Web 部件中。现在我有两个由 onClick 事件触发的过滤器操作。

每个动作如下所示：要按已关闭的协议过滤：

private getEnded(): void {
this.props.provider.getEnded().then((originalitems: IList[]) => {

  this.setState({
    filteredListItems: originalitems,
    filter: true
  });
});

}

并按过去的最后一天进行过滤：

 private getPassed(): void {
this.props.provider.getPassed().then((originalitems: IList[]) => {
  this.setState({
    filteredListItems: originalitems,
    filter: true
  });
});

}

并且在数据提供程序文件中我有这些方法，它们中的每一个都向 SharePoint 发出请求，唯一的区别是过滤器参数：

获取关闭协议（从方法 getEnded() 调用）：

public async getEnded(): Promise<IList[]> {
let today = new Date();
let Agreements: IList[] = [];

const items = await sp.web.lists
  .getByTitle("AgreementDatabase")
  .items.select(this.select)
  .filter(
    `(AgreementEnded eq true) and (AgreementEndDate le '${today.toISOString()}')`
  )
  .expand("SalesManager,TaxCatchAll,FrameworkAgreement")
  .get();

items.forEach(item => {
  Agreements.push({
    Title: item.Title,
    Id: item.Id,
    CustomerAgreementNr: item.CustomerAgreementNr,
    AgreementType: item.AgreementType,
    Customer: item.TaxCatchAll[0].Term,
    FrameworkAgreement: item.FrameworkAgreement.Title,
    ContactPerson: item.ContactPerson,
    SalesManager: item.SalesManager.FirstName + " " + item.SalesManager.LastName,
    DeliveryType: item.DeliveryType,
    AgreementStartDate: item.AgreementStartDate,
    AgreementEndDate: item.AgreementEndDate,
    AgreementEnded: item.AgreementEnded,
    LastPriceAdjustment: item.LastPriceAdjustment,
    NextPriceAdjustment: item.NexPriceAdjustment,
  });
});

return new Promise<IList[]>(async resolve => {
  resolve(Agreements);
});

}

并获得通过协议（从方法 getPassed() 调用）：

public async getPassed(): Promise<IList[]> {
let today = new Date();
let Agreements: IList[] = [];


const items = await sp.web.lists
  .getByTitle("AgreementDatabase")
  .items.select(this.select)
  .filter(`LastPriceAdjustment le '${today.toISOString()}'`)
  .expand("SalesManager,TaxCatchAll,FrameworkAgreement")
  .get();

items.forEach(item => {
  Agreements.push({
    Title: item.Title,
    Id: item.Id,
    CustomerAgreementNr: item.CustomerAgreementNr,
    AgreementType: item.AgreementType,
    Customer: item.TaxCatchAll[0].Term,
    FrameworkAgreement: item.FrameworkAgreement.Title,
    ContactPerson: item.ContactPerson,
    SalesManager: item.SalesManager.FirstName + " " + item.SalesManager.LastName,
    DeliveryType: item.DeliveryType,
    AgreementStartDate: item.AgreementStartDate,
    AgreementEndDate: item.AgreementEndDate,
    AgreementEnded: item.AgreementEnded,
    LastPriceAdjustment: item.LastPriceAdjustment,
    NextPriceAdjustment: item.NexPriceAdjustment,
  });
});

return new Promise<IList[]>(async resolve => {
  resolve(Agreements);
});

}

可以看到，向SP请求信息的方法几乎是一样的，只是filter参数不同而已。我想知道如何才能重新使用其中一种从共享点获取和过滤数据的剩余方法？

此致美国

Answer 1

您可以编写一个方法并通过文件管理器：

private getEnded(): void {
const filter = `(AgreementEnded eq true) and (AgreementEndDate le '${today.toISOString()}')`;
this.props.provider.getAgreements(filter).then((originalitems: IList[]) => {

  this.setState({
    filteredListItems: originalitems,
    filter: true
  });
});



 private getPassed(): void {
const filter = `LastPriceAdjustment le '${today.toISOString()}'`;
    this.props.provider.getAgreements(filter).then((originalitems: IList[]) => {
      this.setState({
        filteredListItems: originalitems,
        filter: true
      });
    });

public async getAgreements(filterAgreements: string): Promise<IList[]> {
let today = new Date();
let Agreements: IList[] = [];

const items = await sp.web.lists
  .getByTitle("AgreementDatabase")
  .items.select(this.select)
  .filter(filterAgreements)
  .expand("SalesManager,TaxCatchAll,FrameworkAgreement")
  .get();

items.forEach(item => {
  Agreements.push({
    Title: item.Title,
    Id: item.Id,
    CustomerAgreementNr: item.CustomerAgreementNr,
    AgreementType: item.AgreementType,
    Customer: item.TaxCatchAll[0].Term,
    FrameworkAgreement: item.FrameworkAgreement.Title,
    ContactPerson: item.ContactPerson,
    SalesManager: item.SalesManager.FirstName + " " + item.SalesManager.LastName,
    DeliveryType: item.DeliveryType,
    AgreementStartDate: item.AgreementStartDate,
    AgreementEndDate: item.AgreementEndDate,
    AgreementEnded: item.AgreementEnded,
    LastPriceAdjustment: item.LastPriceAdjustment,
    NextPriceAdjustment: item.NexPriceAdjustment,
  });
});

return new Promise<IList[]>(async resolve => {
  resolve(Agreements);
});

其他改进：

您可以使用 .map() 代替 .foreach()

Agreements = items.map(item => {
    Title: item.Title,
    Id: item.Id,
    CustomerAgreementNr: item.CustomerAgreementNr,
    AgreementType: item.AgreementType,
    Customer: item.TaxCatchAll[0].Term,
    FrameworkAgreement: item.FrameworkAgreement.Title,
    ContactPerson: item.ContactPerson,
    SalesManager: item.SalesManager.FirstName + " " + item.SalesManager.LastName,
    DeliveryType: item.DeliveryType,
    AgreementStartDate: item.AgreementStartDate,
    AgreementEndDate: item.AgreementEndDate,
    AgreementEnded: item.AgreementEnded,
    LastPriceAdjustment: item.LastPriceAdjustment,
    NextPriceAdjustment: item.NexPriceAdjustment,
});

在 SPFx Web 部件中重构休息请求

Refactoring rest request in SPFx Web aprt

rest

spfx