La representación de la lista en el componente principal funciona perfectamente
<stock-card class="col-sm" v-for="(stock, index) in formattedStocks" :stock="stock" :key="index" > </stock-card>En el componente anidado, solo representa la primera instancia del ciclo dentro del componente modal
<p class="card-text text-success">{{ stock["name"] }}$</p> <button class="btn btn-danger rounded-pill" data-bs-toggle="modal" data-bs-target="#exampleModal" @click="buyStock(stock)" > Activate Modal </button> <modal :modalTitle="stock['name']" />Tengo accesorios en ambos componentes.
El problema está en la forma en que se usó modal.
Generalmente, el modal de arranque se abre usando los atributos data-bs-toggle="modal" and data-bs-target="modalInfo" . data-bs-target está conectado con id="modalInfo" para abrir y cerrar el modelo.
En su caso, para los tres tiene el mismo objetivo e identificación de datos, por lo tanto, mostraba el mismo primer modal en todos los casos.
Aquí está el ejemplo de trabajo: Codesandbox