Sharepoint Framework Property Pane Choice Group Options in an Array
I Am Wanting to Put a Drop Down List in the Property Pane: Propertypanechoicegroup('Marvels', { Label: "Marvels", Options: [ { Key: 'Hulk', Text: 'Hulk' }, {...
I am wanting to put a drop down list in the property pane:
PropertyPaneChoiceGroup('Marvels', {
label: "Marvels",
options: [
{ key: 'Hulk', text: 'Hulk' },
{ key: 'Thor', text: 'Thor' },
{ key: 'Captain America', text: 'Captain America' },
{ key: 'Ironman', text: 'Ironman' } ,
],
})
What I would like to do is to iterate over an array of names instead:
let marvelNames: string[] = ["Hulk", "Thor", "Cap", "Iron"];
PropertyPaneChoiceGroup('Marvels', {
label: "Marvels",
options: [
for (let name in marvelNames) {
{ key: "name", text: "name" }
}
],
})
I don't know how to achieve this.
I've only been working with JS/TS for a few weeks now and have much to learn.
1 Answer
You need to populate the values as below:
let marvelNames: string[] = ["Hulk", "Thor", "Cap", "Iron"];
var characters: IPropertyPaneChoiceGroupOption[] = [];
marvelNames.map(function(item){
characters.push({
key:item,
text: item
})
});
After modify the property pane as:
PropertyPaneChoiceGroup('Marvels', {
label: "Marvels",
options: characters
})
Also, ensure that you have the correct import statement which includes IPropertyPaneChoiceGroupOption somewhat as:
import {
BaseClientSideWebPart,
IPropertyPaneConfiguration,
PropertyPaneTextField,
PropertyPaneChoiceGroup,
IPropertyPaneChoiceGroupOption
} from '@microsoft/sp-webpart-base';
Robert Thorne covers electric vehicle innovations, autonomous driving systems, global mobility trends, and automotive engineering developments.
