首页 > 解决方案 > 如何在单个 spfx 解决方案中创建两个 webpart?

问题描述

我的最终目标是创建一个 spfx 项目,允许我将两个 Web 部件添加到 SPO 页面。这两个 Web 部件将分别连接到不同的自定义列表。Webpart (A) 将在项目旁边有一个按钮,如果用户单击该按钮,那么它将根据 Webpart (A) 中项目的 ID 过滤 Webpart (B)。我已经创建了一个 spfx 项目。它目前有一个.ts文件,该文件具有项目的“入口点”。这允许我将该 web 部件添加到 SPO 页面。如上所述,我希望能够为 SPO 页面创建两个不同的 webpart。问题:我会创建两个“入口点”.ts文件吗?或者这不是必需的吗?如果没有必要,我该如何做到这一点?

除此之外还有任何示例代码 - https://github.com/SharePoint/sp-dev-fx-webparts/tree/master/samples/react-events-dynamicdata

为了您的信息,这里是我指的一些入口点代码:

...
export default class ConnectedWebpartsWebPart extends BaseClientSideWebPart <IConnectedWebpartsWebPartProps> {
  public onInit(): Promise<void> {
    return super.onInit().then(_ => {
      // other init code may be present
      pnpSetup({
        spfxContext: this.context
      });
    });
  }
...

汤姆

标签: spfx

解决方案


这很简单 - 只需使用 Yeoman 并在现有项目的文件夹中运行另一个 yo @microsoft/sharepoint。现在尝试连接这 2 个 Web 部件……这是个棘手的问题。


推荐阅读