v-bind support binding multiple objects about rfcs

[cyfung1031]

@cyfung1031 using spread operator or Object.assing would result in overriding props instread of merging them. What if featAProps have onClick/class and featBProps as well? that's why you have to use mergeProps

This is another issue. You are not asking for binding multiple objects. You are asking for binding multiple methods to the same attribute in the same component.

You should open another issue for this. They are different.

The working principle for v-bind is based on the key-value relationship.

[cyfung1031]

Currently most scripts use {...$attrs, ...featAProps, ...featBProps}
Is it really neccessary to introduce the array form?

[LinusBorg]

I agree, I don't think we need to add another variation to this API.

[cyfung1031]

@posva I think this is not a issue...
we have native ES syntax for combining multiple objects
{...$attrs, ...featAProps, ...featBProps}
I think this issue can be closed.

[sqal]

@cyfung1031 using spread operator or Object.assing would result in overriding props instread of merging them. What if featAProps have onClick/class and featBProps as well? that's why you have to use mergeProps

[KaelWD]

This seems to be supported (accidentally?) only if you have other attributes bound too.

// Works
<MyComponent foo="bar" v-bind="$attrs, featAProps, featBProps" />
// Doesn't
<MyComponent v-bind="$attrs, featAProps, featBProps" />

This is because attributes + v-bind is compiled directly to a mergeProps call:

_createBlock(_component_MyComponent, _mergeProps({ foo: "bar" }, _ctx.$attrs, _ctx.featAProps, _ctx.featBProps), null, 16 /* FULL_PROPS */)

But v-bind alone uses guardReactiveProps instead which only accepts a single argument:

_createBlock(_component_MyComponent, _normalizeProps(_guardReactiveProps(_ctx.$attrs, _ctx.featAProps, _ctx.featBProps)), null, 16 /* FULL_PROPS */)

Related: vuejs/eslint-plugin-vue#1731

[ThaDaVos]

This seems to be supported (accidentally?) only if you have other attributes bound too.

// Works
<MyComponent foo="bar" v-bind="$attrs, featAProps, featBProps" />
// Doesn't
<MyComponent v-bind="$attrs, featAProps, featBProps" />

This is because attributes + v-bind is compiled directly to a mergeProps call:

_createBlock(_component_MyComponent, _mergeProps({ foo: "bar" }, _ctx.$attrs, _ctx.featAProps, _ctx.featBProps), null, 16 /* FULL_PROPS */)

But v-bind alone uses guardReactiveProps instead which only accepts a single argument:

_createBlock(_component_MyComponent, _normalizeProps(_guardReactiveProps(_ctx.$attrs, _ctx.featAProps, _ctx.featBProps)), null, 16 /* FULL_PROPS */)

Related: vuejs/eslint-plugin-vue#1731

Is this still considered a bug or is it a feature? It seems to still work in Vue 3 without any errors and I only have a separate class attribute on it, not even a prop