Sep 25 2019 02:06 PM
I am writing a simple web part. It takes a property of "List". The user will pick the list from a dropdown. I am using the tutorial found here:
I have the following function that uses PNPJS to return an array of the lists on the site.
protected fetchLists(): Array<IPropertyPaneDropdownOption> {
let options: Array<IPropertyPaneDropdownOption> = new Array<IPropertyPaneDropdownOption>();
sp.web.lists.select('ID', 'Title', 'DefaultViewUrl').get().then(function(data) {
for (let i = 0; i < data.length; i++) {
if (data[i].DefaultViewUrl.includes('/Lists/')) {
options.push({
key: data[i].Title,
text: data[i].Title,
});
}
})
console.log(options);
});
return options;
}
protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
let lists: Array<IPropertyPaneDropdownOption> = this.fetchLists();
return {
pages: [
{
header: {
description: this.description
},
groups: [
{
groupName: 'Properties',
groupFields: [
PropertyPaneDropdown('list', {
label: 'List',
options: lists
}),
PropertyPaneTextField('field', {
label: 'Field'
})
]
}
]
}
]
}
}
The problem is the sp.web.lists... call is seen by the editor as not ways returning a value. I have tried to use the .then(function() {}) to return the array but the IDE still says not all paths return a value. How can I satisfy the IDE and still always get a return array (even if it is empty)?
Sep 25 2019 02:27 PM
So I made the following changes. I added the catch method and put another return in there but the IDE still doesn't think that my code always returns as a value.
protected fetchLists(): Array<IPropertyPaneDropdownOption> {
let options: Array<IPropertyPaneDropdownOption> = new Array<IPropertyPaneDropdownOption>();
sp.web.lists.select('ID', 'Title', 'DefaultViewUrl').orderBy('Title').get().then(function(data) {
for (let i = 0; i < data.length; i++) {
if ((data[i].DefaultViewUrl.includes('/Lists/')) &&
(
(data[i].Title != 'SharePointHomeCacheList') ||
(data[i].Title != 'TaxonomyHiddenList')
)) {
options.push({
key: data[i].Title,
text: data[i].Title,
});
}
}
return options;
}).catch(function(e) {
return options;
});
}
Sep 25 2019 02:31 PM
Sep 26 2019 10:58 AM
Sep 26 2019 01:13 PM
This is what I am left with for now. My this.lists object is still empty before it gets to the PropertyPaneDropdown object and I don't know what to do to fix that.
protected fetchOptions(): IPropertyPaneDropdownOption[] {
var options: Array<IPropertyPaneDropdownOption> = new Array<IPropertyPaneDropdownOption>();
sp.web.lists.select('ID', 'Title', 'DefaultViewUrl').orderBy('Title').get().then(function(data){
for (let i = 0; i < data.length; i++) {
options.push({
key: data[i].Title,
text: data[i].Title
})
}
return options;
});
return null;
}
protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
if (!this.lists) {
this.lists = this.fetchOptions();
this.onDispose();
}
return {
pages: [
{
header: {
description: this.description
},
groups: [
{
groupName: 'Properties',
groupFields: [
PropertyPaneDropdown('list', {
label: 'List',
options: this.lists
})
]
}
]
}
]
};
}