Hello everybody I am making a Internet Half so as to show a full width Bootstrap grid with you may personalize Sharepoint pages. Choosing the Grid Measurement choices the Grid is created and every part works high quality. However I would like additionally to show the properties from a single cell so as to customise all of the Grid Cells. I attempted every part however i Can solely show one object. If im proper the IPropertyPanePage.teams is an array of Objects however I simply can present one object on the time. I do know that this could possibly be simple for a few of you however I really want a assist. I am utilizing React framework to construct the webpart.

    return {
      pages: [
        {
          header: {
            description: strings.PropertyPaneDescription
          },
          groups:[
            {
              groupName: strings.BasicGroupName,
              groupFields: [
                PropertyPaneDropdown('GridSize', {
                  label: 'Please Select the Size of the Grid',
                  disabled: false,
                  options: this.gridOptions
                })
              ]
            }
          ]
        },
        {
          //Web page 2
          displayGroupsAsAccordion: true,
          header: {
            description: 'Cells Properties'
          },
          teams: [          
              this.getCellProps()  
          ]
        }
      ]
    };
  }
}

operate code under

  personal getCellProps() {

    var totalcells = 1 * 4;
    console.log('whole=' + totalcells);

    if (totalcells != 0) {

      var listPanels =[];

      for (var x = 1; x <= totalcells; x++) {
      //console.log(x);

        var singlePanel = {
          groupName: "Panel"+x,
          isCollapsed: true,
          groupFields: [
            PropertyPaneHorizontalRule(),
            PropertyPaneTextField('Title', {
              label: 'Title Panel',
              placeholder: 'Insert Title',
            }),
            PropertyPaneTextField('ImgPath', {
              label: 'Image Path',
              placeholder: 'Insert Path Image URL',
            }),
            PropertyPaneTextField('Link', {
              label: 'Link Image',
              placeholder: 'Insert Link',
            }),
            PropertyPaneDropdown('WidthValue', {
              label: 'Width Value',
              disabled: false,
              options: this.widthOption
            }),
            PropertyFieldToggleWithCallout('toggleInfo', {
              calloutTrigger: CalloutTriggers.Click,
              key: 'toggleInfo',
              label: 'Disable Link Pane',
              calloutContent: React.createElement('p', {}, 'With this control you can enable or disable the link for this cell'),
              onText: 'Disabled',
              offText: 'Enabled',
              checked: this.properties.toggleInfo
            }),
            PropertyFieldToggleWithCallout('IsHidden', {
              calloutTrigger: CalloutTriggers.Click,
              key: 'IsHidden',
              label: 'Hidden/Show Panel',
              calloutContent: React.createElement('p', {}, 'With this control you can Hidden or Show the cell'),
              onText: 'Hidden',
              offText: 'Show',
              checked: this.properties.IsHidden
            }),
            PropertyFieldToggleWithCallout('IsCircle', {
              calloutTrigger: CalloutTriggers.Click,
              key: 'IsCircle',
              label: 'Square/Circle Image',
              calloutContent: React.createElement('p', {}, 'With this control you can Modify the shape of the image'),
              onText: 'Circle',
              offText: 'Square',
              checked: this.properties.IsCircle
            }),
            PropertyFieldToggleWithCallout('NoTitle', {
              calloutTrigger: CalloutTriggers.Click,
              key: 'NoTitle',
              label: 'Enable/Disable Title',
              calloutContent: React.createElement('p', {}, 'With this control you can enable or disable the Title '),
              onText: 'Disabled',
              offText: 'Enabled',
              checked: this.properties.NoTitle
            })
          ]
        };
        listPanels.push(singlePanel);
        console.log(listPanels.size);
      }
      return listPanels[3];
    }
  }