Correct way of saving data to a page column from SPFx webpart while page is in edit mode

What type of issue is this?

Question

What SharePoint development model, framework, SDK or API is this about?

💥 SharePoint Framework

Target SharePoint environment

SharePoint Online

What browser(s) / client(s) have you tested

• 💥 Internet Explorer
• 💥 Microsoft Edge
• 💥 Google Chrome
• 💥 FireFox
• 💥 Safari
• mobile (iOS/iPadOS)
• mobile (Android)
• not applicable
• other (enter in the "Additional environment details" area below)

Additional environment details

• browser version: all
• SPFx version: newest

Issue description

I am looking for a way to store data that a user enters into a SPFx web part while the page is in edit mode in a page column. A column because I want to query the data via search.

The process would be as follows:

• User edits the page
• Adds the WebPart
• Enters data into the web part
• Saves the page
• Data is saved in a column

I am aware that the data from a web part is saved in web part properties and that these properties can be made searchable. I can then also find results via the search. However, the data can only be found in the managed property “SPFxExtensionJson”, hidden in HTML and JSON. This is not a nice way to work with the data.

The APIs “ValidateUpdateListItem” and “/_api/sitepages/SavePage” are also known to me, but no longer really work in the new “collaboration mode”. Before this new mode, I could save data in the column via “ValidateUpdateListItem”, but this is overwritten as soon as the page is saved via the interface.

What I am looking for would be an API in the web part itself, for example a function like “onPageSave(oldValue, newValue)” which is executed as soon as the user saves the page via UI and as a web part developer you can still influence what is saved and insert data.

Or is there an other way to edit the list item of the page while the user is in edit mode?