<p dir="auto">Hello, I'd like to suggest the following syntax that you may add to future releases.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;my-component ::params @@myMethod /&gt;"><pre class="notranslate"><code class="notranslate">&lt;my-component ::params @@myMethod /&gt;
</code></pre></div>
<p dir="auto">Could be equivalent to</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;my-component :params=&quot;params&quot; @myMethod=&quot;myMethod&quot; /&gt;"><pre class="notranslate"><code class="notranslate">&lt;my-component :params="params" @myMethod="myMethod" /&gt;
</code></pre></div>
<p dir="auto">That would make code much cleaner when we have to pass multiple props to a child component and those props have the same name as the variables in the parent component. The same thing can be said about events.</p>
<p dir="auto">I hope you take this into consideration and that my suggestion will help you improve VUE.</p>
<h3 dir="auto">What problem does this feature solve?</h3>
<p dir="auto">When passing props to a component, the following pattern is very common,</p>
<p dir="auto"><code class="notranslate">&lt;my-component :propA="propA" :propB="propB" /&gt;</code></p>
<p dir="auto">I am proposing that when the prop name is the same as the variable name being passed to it, that the following more concise syntax be applicable,</p>
<p dir="auto"><code class="notranslate">&lt;my-component :propA :propB :propC /&gt;</code></p>
<p dir="auto">This would mimic ES6's object property declaring shorthands (like here <a href="http://www.benmvp.com/learning-es6-enhanced-object-literals/" rel="nofollow">http://www.benmvp.com/learning-es6-enhanced-object-literals/</a>)</p>
<h3 dir="auto">What does the proposed API look like?</h3>
<p dir="auto"><code class="notranslate">&lt;my-component :propA :propB :propC /&gt;</code></p>
<p dir="auto">instead of</p>
<p dir="auto"><code class="notranslate">&lt;my-component :propA="propA" :propB="propB" /&gt;</code></p>