Skip to content

How do I save/handle/load data when using React/Vue/Angular components? #16717

Open
@Reinmar

Description

📝 Provide a description of requested docs changes

Problems

The following 3 guides:

None of them explains how to handle data.

At the same time, the dedicated guide for getting and setting data covers it from the vanilla JS perspective. Which isn't necessary translatable.

Finally, I remember we discussed people using the onChange() attribute of the React component which is an anti-pattern due to performance and UX implciations.

However, it's not a surprise that people use the wrong method if we don't offer nor document the correct ones.

Definition of done

  • The generic Getting and setting data guide should have short sections for Angular/Vue/React (titled in a discoverable way) sending people to the specific sections in framework guides.
  • We should agree on the recommended ways to handle saving data via integrations: covering autosaving and saving on demand. Potentially, we may need to expose new API on the existing components (like onAutosave for React).
  • We should document the recommended ways to autosaving, saving on demand and setting data in all 3 integration guides. At the end of these we can still link to the generic one if it'll still contain valuable information extending those baseline recommendations.
  • Non-recommended, anti-pattern solutions should be pointed out. E.g. the onChange callback should be extended with a note that it's not recommended to use it to save data (link to onAutosave).

These are the minimal steps. We can do more ofc.

Metadata

Assignees

No one assigned

    Labels

    domain:docs-experiencedomain:dxThis issue reports a developer experience problem or possible improvement.domain:integration-dxThis issue reports a problem with the developer experience when integrating CKEditor into a system.squad:coreIssue to be handled by the Core team.type:docsThis issue reports a task related to documentation (e.g. an idea for a guide).

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions