Vue deep nested history - v-model parent-component: mounted set var -> child-component: props = undefined?

Question

Vue.js

Why, when in the parent component the variable is "collected" in the mounted hook and passed to the child component nested in the parent through an attribute, then picked up through props, then the variable is initially undefined - and when accessing it in the template - an error.
PS
if in the parent variable to collect through computed - all the rules. but when changing a variable in a child, it does not "return" to the parent
PPS
there is such an example where the nesting of components is more than one level - the task is to change the entity model in the parent, the need for such nesting is the reuse of components in the application ... the question between the lines is - what the solution is not optimal ... where is the truth?
PPPS
forked another example- got rid of heresy in computed - translated everything through the method of building a model. but where is the beauty? returned to the beginning of the question - initially the data is not defined - you have to wait for their definition and hide the template with the v-if="dataModel" condition

Answer 1

Because mounted() is called when the component is already mounted. You can move the datamodel definition to the created() hook and it should work.

Answer 2

Both will go, but take the first, there you need less voltage.
____
You can not think about timings and frequencies at all, because your homeopathic gain can be leveled without an alternative by a sudden cosmic ray of world balance, which has been flying through the universe for 10,000 years and will burn your memory on the same day you set it.