时间戳

首页 > 解决方案 > Vue.js2 - 数组包含 __ob__ ：观察者

javascript - Vue.js2 - 数组包含 __ob__ ：观察者

问题描述

（可能）关于 vue.js 的初学者问题。我正在尝试使用通过 websocket 接收的 CanvasJS 库来显示数据。在我开始使用 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.cartesianCanvasJS 的内容，因为它不显示任何数据。
由于除了使用之外我没有看到任何其他方式来显示我的数据，因此this.cartesian我希望就我在这里可能做错的事情或如何访问数据获得帮助，this.cartesian因为我在浏览器中检查它时可以看到它。

标签： javascriptvue.jsvuejs2

解决方案

因为cartesian是组件数据的一部分，它通过添加 getter 和 setter 变得反应。

您可以使用一些技巧来绕过这个预期的功能，但如果您使用ES6的对象扩展解构功能，通常不需要这样做。

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

推荐阅读