actualmente me enfrento al problema de que Vue emite una advertencia: "Se excedieron las actualizaciones recursivas máximas. Esto significa que tiene un efecto reactivo que está mutando sus propias dependencias y, por lo tanto, se activa recursivamente. Las posibles fuentes incluyen plantilla de componente, función de representación, enlace actualizado o observador función fuente".

No puedo averiguar dónde debe estar el error. Itero sobre 2 bucles y luego quiero dar un valor de contador al componente interno, que luego se transmite y luego se interpreta por módulo a las clases CSS en el 3er nivel. Desafortunadamente, tengo que hacerlo de esta manera, porque los componentes creados son partes de una cuadrícula CSS creada dinámicamente. Me gustaría proporcionar prácticamente todas las filas, por lo que todas las celdas a la misma altura con una clase uniforme "par/impar".

Aquí está el componente vue que crea este incremento:

 <template> <template v-for="(project, p) in projects" :key="project.id"> <template v-for="(component, c) in project.components" :key="component.id"> <grid-swim-lane :project="project" :component="component" :grid-row-even-odd-count="evenOddCount++" /> </template> </template> </template> <script> import GridSwimLane from "./GridSwimLane"; import {mapGetters} from "vuex"; export default { components: { GridSwimLane }, data() { return { evenOddCount: -1 } }, computed: { ...mapGetters('projects', { projects: 'getAllProjects' }) }, } </script> <style scoped></style>

Este valor de incremento se genera y se pasa con éxito al último componente a pesar de la advertencia. Pero, ¿cómo puedo hacer que funcione sin la advertencia? Ya he probado algunas cosas. Pero no puedo llegar más lejos.

No puedo hacer esto con los selectores de CSS porque quiero trabajar con clases fijas.

Gracias de antemano por tus consejos.