Vue.js2 - Массив содержит __ob__: Observer

Question

(возможно) вопрос новичка относительно vue.js. Я пытаюсь отобразить данные с помощью библиотеки CanvasJS, полученной через websocket. Работа с данными работает нормально, пока я не начну использовать компоненты vue. Чтобы было понятнее:

export default {
  data() {
    return {
      cartesian: null,
      ws: null
    }
  },

  methods: {

    fillData(res) {
     var data = JSON.parse(res.data)

     var buffer = data.mdi
     console.log(buffer)

     this.cartesian = data.mdi
     console.log(this.cartesian)
    }

  },

  mounted() {
    this.ws = new WebSocket('ws://localhost:1111')
    this.ws.onmessage = this.fillData
  }
}

Линия console.log(data.mdi) выводит {0: Array(256), 1: Array(256), 2: Array(256), 3: Array(256)}. Это именно то, что я ожидаю, и что работает с CanvasJS.
Однако строка console.log(this.cartesian) выводит {__ob__: Observer}. Насколько я понимаю, это связано с реактивностью vue.js. К сожалению, я не могу использовать содержимое this.cartesian с CanvasJS, потому что оно не показывает никаких данных.
Поскольку я не вижу другого способа отображения моих данных, кроме использования this.cartesian, я надеюсь на помощь в отношении того, что я могу делать неправильно или как получить доступ к данным в this.cartesian, поскольку я могу видеть их там, когда проверяя это в моем браузере.

Answer 1

Для тех, кто сталкивался с подобной проблемой: {__ob__: Observer} не вмешивался в библиотеку CanvasJS. Я мог бы использовать this.cartesian без проблем. Я просто не нашел правильный способ заполнить мою таблицу данными.
Здесь console.log может вводить в заблуждение, но вы должны иметь возможность использовать ваши данные независимо от {__ob__: Observer} так же, как вы использовали обычный js.

Answer 2

Поскольку cartesian является частью данных вашего компонента, он становится реактивным, добавляя геттеры и сеттеры.

Вы можете использовать некоторые приемы, чтобы обойти эту намеченную функцию, но это обычно не требуется, если вы используете функцию разрушение распространения объекта *1005* ES6.

let cartesianObject = {...this.cartesian};
console.log(cartesianObject);