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
Feature: Use spread operator to pass down props. #4962
Comments
You can already do this with |
Awesome, thanks! |
Can you use |
Ends up the answer is yes! |
the And is there a way to pass down <custom-comp
:subProps="{
prop1: 1, prop2: 2,
'v-on:click': function($e){ console.log($e) },
'v-custom-directive': true
}"
/> custom-comp definition <template>
<div class='custom-comp'>
<input
type='text'
name='name'
v-bind='subProps'
/>
</div>
</template> but the <input data-v-2a851830="" type="text" name="name" prop1="1" prop2="2" v-on:click="function($e) {
_vm.console.log($e)
}" v-custom-directive="true"> the directive is rendered as attributes but not directives |
@magicdawn Have you found a solution to your example? This is a very common pattern I would say, but it seems quite tricky to accomplish (a lot of custom handling in a render method). |
@esbenam not yet with templates if you are tired of writing it supports object spread pattern and express vue terminologies (e.g directives / events) in a prop way |
@magicdawn yeah, that is what I have ended up doing for now. |
Just got the same problem using |
hello , 尤大 。 how to use sync ? |
@caokunyu you can ask questions on the forum, the Discord server or StackOverflow don't do it on issues please 😛 |
Hello,
I propose adding a feature that allows the use of ES6 spread operator to destructure an object into props passed into a component. This feature idea comes from the use of it in react, which is documented here. https://facebook.github.io/react/docs/jsx-in-depth.html#spread-attributes
Imagine an ActorCard that displays a users firstName, lastName, email and imageUrl picture.
Currently
Using spread would allow to pass flat props to the component without all the boiler plate of manually specifying each prop.
Doing this way encourages keeping props flat, which ultimately makes components more reusable (i.e. i don't have to construct an object that has property of firstName and lastName just to reuse this actor card if i go the easy route and just pass in a user.)
If this is something that is agreeable, i'm happy and willing to put in the work to get a PR for it.
Thanks!
Austin
The text was updated successfully, but these errors were encountered: