VueJS _ob_ Observer преобразовать в массив

Question

Делаю запрос axios.

            axios.get('/api/dating-card/to-assess', {
                params: this.filters
            }).then(response => {
                response.data.datingCards.map(el => {
                    this.dating_cards.push(el);
                })
            });
            console.log(this.dating_cards);

При выводе console.log виден тип ob Observer.

Мне нужно чтобы это был обычный массив. Много читал про этот тип, якобы Vue преобразует все объекты в него для быстрого отображения. Также пробовал делать Json.parse(Json.stringify(this.dating_cards)). Но это просто выводит пустой массив. Объекты из ob Observer туда не попадают. Есть ли простой способ преобразовать это в массив или отменить автоматическое преобразование в обсервер от VueJS?

Answer 1

Observer - Это специальное свойство, добавленное Vue, это часть системы реактивности, которая позволяет Vue отслеживать изменения данных и реагировать на их изменения (Система реактивности).

Простое решение для избавления от системы реактивности от создателя Vue (Evan You) - использование: JSON.parse(JSON.stringify(...))

Рабочий пример для наглядности:

new Vue({
  el: '#app',
  data() {
    return {
      dating_cards: [],
      filters: {}
    }
  },
  mounted() {
    this.getData()
  },
  methods: {
    async getData() {
      await axios.get('https://jsonplaceholder.typicode.com/todos?_limit=5', {
        params: this.filters
      }).then(response => {
        response.data.map(el => {
          this.dating_cards.push(el);
        })
      });

      console.log(JSON.parse(JSON.stringify(this.dating_cards)));
    }
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.0.0-alpha.1/axios.min.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<div id="app">
  <pre>
  {{dating_cards}}
</pre>
</div>

Открыв консоль разработчика в браузере (F12) вы можете наблюдать вывод обычного массива.

БЛОГ НА HUSL

VueJS _ob_ Observer преобразовать в массив

Ответы (1 шт):