Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Some way of binding bidirectionally to all props in an object, capturing all custom events. #2226

Open
saabi opened this issue Mar 15, 2019 · 1 comment

Comments

@saabi
Copy link

saabi commented Mar 15, 2019

There seems to be no way of bidirectionally binding to all of a component's arbitrary props.

<!-- pass arbitrary props, already there -->
<svelte:component this={someComponent} {...itsProps} />

<!-- get changes to arbitrary props, missing, various potential syntaxes follow -->
<svelte:component this={someComponent} bind:{...itsProps} />

<svelte:component this={someComponent} bind:$$props />

<svelte:component this={someComponent} {...itsProps} on:propsChanged={propHandler} />

I would say it could/should also be available outside of <component/> to enable generic handling of children.

This would be useful for updating a property tree of components, which could be useful for serializing and deserializing component trees. Also for the particular situation of svelte-subdivide, which would benefit from persisting a prop configuration.

For example, at present svelte/svelte-subdivide can receive a layout property specifying a layout geometry that will instantiate the same component in each Pane, but you can't specify the properties of this object, much less for each indivdual instance.

I'm adding this capability to it. In that version, you can pass arbitrary component props individually to each pane.

However, I can't capture those arbitrary props later on if they change.

It could also be useful to capture all custom events in a similar fashion, I have no need for it at present and so far can only think of its usefulness for debugging perhaps.

Considerations

Should properties from grandchild components be available for serialization as well? How would one choose child props, or props from all descendants?

Example

The closest I can achieve so far:

https://v3.svelte.technology/repl?version=3.0.0-beta.15&gist=52549b8577ff8f3f47cd25139877d371

But in the example, I'm forced to add logic to Component3.svelte, which ideally would be a generic component with no special custom logic.

@sxxov
Copy link

sxxov commented Aug 1, 2021

I've written an RFC at sveltejs/rfcs#57 in an attempt to propose a solution for this. Anyone one looking at this problem should feel free to chime in.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants