C
C
Comnox2021-08-10 09:28:50
Vue.js
Comnox, 2021-08-10 09:28:50

Reactivity issue in Vue 3 when rendering elements in computed?

good afternoon, I ran into such a problem that when rendering elements depending on the getter, the elements on the page are not rendered, although there is a look through the extension, everything is rendered at once and the values ​​are displayed correctly, I tried this.$forceUpdate() - it didn’t help,
myself component code:

computed: {
    ...mapGetters(["bigCardsList"]),
    renderPlacemarks() {
      return this.bigCardsList.length
        ? this.bigCardsList.forEach((city) => {
            this.addNewPlacemark(
              [city.coordinates.latitude, city.coordinates.longitude],
              city.city
            );
            this.map.panTo([
              city.coordinates.latitude,
              city.coordinates.longitude,
            ]);
            this.$forceUpdate();
          })
        : this.map.panTo(this.initCoordinate);
    },
  },
  methods: {
    addNewPlacemark(coordinates, hintContent) {
      this.map.geoObjects.add(
        new ymaps.Placemark(coordinates, {
          hintContent: hintContent,
        })
      );
    },
  },
};

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question