Tengo una plantilla, y hay un componente:
<super-visor v-if="!top10ModeActivated" v-for="cart in getCarts(index + 1)" :cart="cart" :key="cart.position" ></super-visor> Como puede ver, este componente se procesa cuando top10ModeActivated es solo false ;
computed: { top10ModeActivated() { return this.$store.state.moduleSearch.top10ModeActivated; }, } Puse el debugger en top10ModeActivated y funciona solo cuando el componente se procesa solo por primera vez. Entonces veo mi componente, solo cuando actualizo la página pero no cuando cambio la ruta.
¿Alguien puede ayudarme y describirme cómo puedo solucionar esto? Porque soy nuevo en VueJS.
Utilice métodos porque las propiedades calculadas se almacenan en caché . Vea abajo:
methods: { top10ModeActivated() { return this.$store.state.moduleSearch.top10ModeActivated; }, }y
<super-visor v-if="!top10ModeActivated()" v-for="cart in getCarts(index + 1)" :cart="cart" :key="cart.position" ></super-visor>Acceder al estado de la tienda directamente desde la propiedad calculada no lo hace reactivo. Utilice captadores en su lugar. Cree un captador de Vuex que devolvería top10ModeActivated y luego llame a ese captador en una propiedad calculada para que sea reactivo.