为 SharePoint 框架扩展占位符预分配空间

应用程序自定义工具可用于在新式页面上添加结构和内容。 这可以通过在页面中使用特定的占位符来实现,然后自定义扩展性将加载到该占位符。 由于扩展将在页面加载生命周期中加载相当晚,因此添加扩展时可能会有额外的页面移动。

注意

此功能仅在 SharePoint Online 中受支持。

若要减少页面移动,可以在创建页面结构时 预先分配 服务器端已有的扩展区域。 可以通过在集合中使用新 HostProperties 属性来应用此配置, UserCustomAction 以在服务器端指示哪些应用程序自定义工具加载到页面。

有两个不同的特定属性,可用于 HostProperties 配置:

  • preAllocatedApplicationCustomizerTopHeight:顶部占位符的预分配高度
  • preAllocatedApplicationCustomizerBottomHeight:底部占位符的预分配高度

正在以像素为单位定义高度。

在SharePoint 框架解决方案中定义 HostProperties 分配

可以直接在SharePoint 框架解决方案代码中定义服务器端预分配,从而确保在使用解决方案时应用预分配。 可以根据解决方案设计,在 elements.xmlClientSideInstance.xml 文件中定义预分配。

主机属性值必须在 xml 文件中正确编码,以确保解决方案的打包成功。

在站点范围内部署上定义预分配

如果扩展设计为安装在站点范围上,则可以使用 ./sharepoint/assets/elements.xml 文件配置预分配。 当站点范围上安装SharePoint 框架解决方案时,此文件中包含的配置默认应用于站点。

以下 xml 片段已使用其他 HostProperties 条目进行了更新,并将默认高度定义为 50 像素。

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <CustomAction
      Title="HeaderDemo"
      Location="ClientSideExtension.ApplicationCustomizer"
      ClientSideComponentId="03dd08c7-2575-4336-899e-68cfce663c4d"
      ClientSideComponentProperties="{&quot;testMessage&quot;:&quot;Test message&quot;}"
      HostProperties="{&quot;preAllocatedApplicationCustomizerTopHeight&quot;:&quot;50&quot;,&quot;preAllocatedApplicationCustomizerBottomHeight&quot;:&quot;50&quot;}">
  </CustomAction>
</Elements>

使用租户范围的部署选项定义预分配

可以通过在 ./sharepoint/assets/ClientSideInstance.xml 文件中为 ClientSideComponentInstance 元素添加 HostProperties 属性,将目标为使用租户范围的部署选项激活的扩展配置为使用预分配的空间。

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <ClientSideComponentInstance
      Title="HeaderDemo"
      Location="ClientSideExtension.ApplicationCustomizer"
      ComponentId="03dd08c7-2575-4336-899e-68cfce663c4d"
      Properties="{&quot;testMessage&quot;:&quot;Test message&quot;}"
      HostProperties="{&quot;preAllocatedApplicationCustomizerTopHeight&quot;:&quot;50&quot;,&quot;preAllocatedApplicationCustomizerBottomHeight&quot;:&quot;50&quot;}">
  </ClientSideComponentInstance>
</Elements>

HostProperties 此配置中的条目将添加到应用程序目录网站集的 “租户范围扩展 ”列表条目,其中每个项目都有一个 “主机属性” 列。

注意事项

根据实现情况,需要注意一些注意事项:

  • 当给定的高度过大时,div 将在指定位置上具有额外的空间。 如果高度小于应用程序自定义工具,则应用程序自定义工具将压缩到占位符中。
  • 如果已定义预分配,但应用程序定制器未在代码中创建占位符或在页面上未关联,则服务器端分配的空间将保留在页面上。

注意

HostProperties还可以为现有应用程序自定义工具定义,无论是修改网站级别 CustomAction 对象,还是通过使用应用程序目录站点的租户范围扩展列表中的“主机属性”列。 由于这是服务器端设置,因此还可以应用于使用旧SharePoint 框架版本生成的扩展。