Vue: <component is="input"> not update value

[dimensi]

Version

2.5.2

Reproduction link

https://codesandbox.io/s/9o6xpml92w

Steps to reproduce

write in input some words.
click on reset button.

What is expected?

expect get clear value in input

What is actually happening?

value in input not cleared

[yyx990803]

value will only be automatically bound as a DOM property when the tag is statically input. Using a dynamic <component is> makes the value bound as an attribute, which only binds the initial value for the input.

You can use :value.prop="valueInput" to force it into a property instead.

[varadekd]

I am also facing the similar issue, I am trying to generate more than one dynamic component.

<button @click="value='One'" >Show 1</button>
<component :is="value"/>
<component :is="depvalue"/>

using this specific code but how to update depvalue. Please help me

[MaherSoua]

Hi @varadekd , I think that you should ask this question in stackoverflow, but I think I can help,
you are trying to change (value)'s value with the click but not for depValue
<button @click="value='One'" >Show 1</button> <button @click="depvalue='Two'" >Show 2</button> <component :is="value"/> <component :is="depvalue"/>

[varadekd]

Hi, @MaherSoua I don't want two different buttons to load two component, I want that on a single click both the component should be loaded. i.e when I click on show 1

<component :is="value "/>
<componen :is="depvalue"/>

this two-component should be loaded

[MaherSoua]

@varadekd In all case you have to assign value to depValue something like that
@click="value='One' depValue='Value'"

[varadekd]

We can go like this

getComponent(arg1,arg2){
this.value = arg1;
this.depvalue = arg2;
}

[yyx990803]

On another thought - we can't change this because <component :is> may also be a real component, in which case value must be bound normally to be extracted as a component prop. Please use the suggest workaround (explicitly adding .prop modifier).