Within my project, there are three Vue components that utilize the Composite API with the setup option. My goal is to access data within a nested tree structure.
The code below provides a simplified version of what I am trying to achieve. The application follows the Atom Design principles (refer to ).
// Wrapper.vue
// High-level component composing smaller ones -> Organism
<template>
<div>Wrapper Text</div>
<Comp1 :isEdit="isEdit" :dataArr="data">
<div class="some css">{{item.name}} – {{item.description}}</div>
</Comp1>
</template>
... (code continues)
<p>In the wrapper component, I want to define a template for rendering data that is available in Comp2. However, I have not yet discovered how to accomplish this. I looked into provide / inject but did not find a solution.</p>
<p>If accessing the <code>item in the template through provide / inject is possible, please guide me in the right direction. :)