x-modelable allow the sub-component to set the default

[mwnciau]

Given the following:

<div x-data="{who: 'parent'}">
   <p x-data="{whom: 'child'}" x-modelable="whom" x-model="who" x-text="whom">
   </p>
</div>

The output will always be "parent". I'd like to do something (e.g. x-modelable.default or x-model.unobtrusive) so that the output will be "child" by default. This is useful, for example, if the child component has some complicated logic to set the default, and I want the parent to be able to read, but not necessarily write that variable.

x-init also triggers before the parent changes the modelled value, so the only solution currently is to have $nextTick inside of x-init which seems messy.

[ekwoka]

does the parent need to have a value to start with?

x-model.fill will use the one from the child if the parent is '' or null I believe

I kind of feel it should also ahve a .fill.force option to always overwrite...

[mwnciau]

The parent needs to initialize the variable or there's nothing to bind to, and null and undefined values still overwrite the child component's value.

I can't get x-model.fill to work with x-modelable, either. I think it only works for form elements.

https://codepen.io/mwnciau/pen/vYVvRZO