Sp-dev-docs: Programmatically update WebPart properties

[NickSevens]

Category

• [x] Question
• [ ] Typo
• [ ] Bug
• [ ] Enhancement / Suggestion
• [ ] Additional article idea

Expected or Desired Behavior

Is it possible to update a webpart property trough code in SPFx?

Observed Behavior

To update webpart properties the edit properties pane should be used. However, when for example implementing a "dragable tiles" component, the configuration of such component should be saved in the properties without doing this through the toolpane - but directly in the webpart itself (with a check on page state, ...)

Is there a method we can use to update webpart properties without using the tool pane? So for example JSON/XML string can be saved there.

[waldekmastykarz]

You should be able to update the value by directly assigning the value to the particular property, eg:

this.properties.myProp = "newValue";

The only challenge with this approach is that on classic pages it works only when the page is in edit mode and the web part is being edited.

[NickSevens]

Thanks @waldekmastykarz. I'll try it this way.
Ultimate goal would be to have either an in-place configuration of the webpart, or a modal popup from the toolpane - something like the CSWP editor.

[manishgarg1]

Yes. You should be able to control the values in the this.properties object. As far as you keep the properties updated, we will serialize them and they will get saved to the database.

[dcu-sharepoint]

@NickSevens love your bbq

[NickSevens]

@waldekmastykarz @manishgarg1 setting the property value work indeed.
Having all these read-only properties in context etc made me forget about the easiest of options :)
Thanks for the help!

[msft-github-bot]

Issues that have been closed & had no follow-up activity for at least 7 days are automatically locked. Please refer to our wiki for more details, including how to remediate this action if you feel this was done prematurely or in error: Issue List: Our approach to locked issues