Access Vue instance data from outside the instance

I am working on a ASP.NET project with Vue 3 front-end. I have a bunch of Vue Instances that i mount on Razor Views via divs with unique ids.

In one particular page I have two Razor Views, one of which is used as a Partial View(sort of like a child component). Both of them use Vue instances and I am wondering if there is any way in which I can access that parent instance’s methods/data attributes from the child.

The problem right now is that when I create the Partial View with a HtmlHelper, I am directly passing along a data value the first Vue instance that I need to use in the child one. This gives the error of ‘Property “propertyName” was accessed during render but is not defined on instance’

Code:

     //first vue instance
const instance_1= {
    data: function () {
        return {
        firstInstanceProperty : 'some string'
        }
    }
}

    //parent razor View
<div id="parentRazorView">
   <div>some stuff</div>
    @Html.Partial("ChildRazorView", ChildRazorView.CreateFirstInstancePropertyViewModel("firstInstanceProperty")) // this function creates child Razor View and sets .firstInstanceProperty to the value from instance_1
</div>
<script>
    Vue.createApp(instance_1).mount('#parentRazorView');
</script>


    //second vue instance
const instance_2= {
    data: function () {
        return {
        firstInstanceProperty : null
        }
    }
}

    //child Razor View
<div id="childRazorView">
    <div>
       {{ @Model.Instance1Property }} // this is where the error occurs
    </div>
</div>
<script>
    Vue.createApp(instance_2).mount('#childRazorView');
</script>

all insight is appreciated. Thanks!