Vuejs - - Assigning prop value in child after ajax request in parent.

I am sure I am missing something simple here. I have created a reusable child component that includes a input like the following, and I am assigning the initialValue in the data object from the itemValue prop passed to it from the parent.

<template>
    <label>{{itemLabel}}</label>
    <input  v-model="initialValue"  type="text" >
</template>
<script>
export default {

    props: ['itemValue'],

    data(){
         return {
               initialValue: this.itemValue,
         }
    }
</script>

If in the parent component I assign the item-value property directly with a string it works fine.

The problem is I want to set the item-value after making an ajax call in the parent, so I am binding it to a data object property that is set by a method using beforeMount()

<v-child-component :item-value="theValue"></v-child-component>

And...

data(){
   return {
      theValue: null,
   }
},
methods: {
   setvalue(){
       //make ajax axios get request here then set this.theValue
   }
}
beforeMount(){
    this.setValue();
}

When I do it this way the it seems the child's item-value is bound to the null value before ajax call completes and sets the actual value. How can I achieve my purpose here?