v-model in child components

[kjugi]

Version

3.0.0-beta.10

Reproduction link

https://jsfiddle.net/kjugi/ftz7xyo2/

Steps to reproduce

1. Have child component with v-bind="$attrs"
2. Initialize it in parent component with v-model="someField"
3. Type inside input text
4. Should update input value itself and print value in the variable on parent component
5. Click button to clear value from input and parent component variable

Also, I saw an RFC for this update and not sure is it working in a new way

What is expected?

v-model updates on both sides and we don't need to emit any value or trigger value by additional props

I've achieved it here but I think that's not how it should look like

What is actually happening?

Without manual emit update passed we are not able to fill the input. In the second step when we want to clear input we need to pass new value prop which updates the input value

---

[posva]

Can you fix the repro please and update the steps to reproduce (what to do to show the problem). Here is your repro fixed so it runs: https://jsfiddle.net/posva/94ktc5eq/

[kjugi]

Thanks for the help with fiddle @posva . Also, I've updated my issue

[yyx990803]

The RFC specifies:

If the component wants to support v-model without an argument, it should expect a prop named modelValue. To sync its value back to the parent, the child should emit an event named "update:modelValue"

Only passing the props does nothing. v-model when used on native elements (e.g. input) still has corresponding runtime directives to handle the compiled props. When used on components, the component will be responsible for handling the props.