spfx - SPFX Web 部件属性窗格
问题描述
我正在尝试在 spfx webpart 属性窗格的下拉列表中附加共享点列表。但它没有被附加。请帮忙。
export default class ScrollTickerWebPart extends BaseClientSideWebPart<IScrollTickerWebPartProps> {
private dropdownOptions: IPropertyPaneDropdownOption[];
private listsFetched: boolean;
private fetchLists(url: string) : Promise<any> {
return this.context.spHttpClient.get(url, SPHttpClient.configurations.v1).then((response: SPHttpClientResponse) => {
if (response.ok) {
return response.json();
} else {
console.log("WARNING - failed to hit URL " + url + ". Error = " + response.statusText);
return null;
}
});
}
private fetchOptions(): Promise<IPropertyPaneDropdownOption[]> {
var url = "https://abc.sharepoint.com/teams/SharepointPOC" + "/_api/web/lists?$filter=Hidden eq false";
return this.fetchLists(url).then((response) => {
var options: Array<IPropertyPaneDropdownOption> = new Array<IPropertyPaneDropdownOption>();
response.value.map((list: IODataList) => {
console.log("Found list with title = " + list.Title);
options.push( { key: list.Id, text: list.Title });
});
return options;
});
}
解决方案
无论你在哪里打电话fetchOptions
,请确保this.context.propertyPane.refresh()
在承诺解决后打电话。这是强制使用新的dropdownOptions
.
举个例子(其他地方onPropertyPaneConfigurationStart
也可以):
protected onPropertyPaneConfigurationStart(): void {
this.fetchOptions().then(options => {
this.dropdownOptions = options;
this.context.propertyPane.refresh();
});
}
这是假设您PropertyPaneDropdown
的设置如下所示,this.dropdownOptions
最初是在哪里undefined
,并且您希望通过以下方式异步加载它们fetchOptions()
:
PropertyPaneDropdown('someProperty', {
// ...
options: this.dropdownOptions,
// ...
})