Vue.js 上带有图表的 Vuefire

Question

我正在尝试将我的图表数组数据与我的 firebase 值同步。图表获取标签和数据的数组。我想将此图表数据值绑定到我的 firebase 对象。这是使用硬编码静态值创建的正常图表：

data()
{
return {appChart: {data: {labels: ["A"], series: [[3]]}},}
},

现在，我想将此值 (3) 与我的 firebase 对象绑定。通常我可以毫无问题地使用这样的 firebase 对象：

new Vue({
   data: () => ({ myObjA: null }),
   firebase: {
      myObjA: db.ref('myObjA'),
      asObject:true
   },
  })

但我无法使用图表数组系列 'a' 绑定和动态更新此 myObjA；

data()
{
return {appChart: {data: {labels: ["A"], series: [[myObjA]]}},}
},

我该怎么做？

Answer 1

您可以更改appChart要计算的属性：

export default {
  data: () => ({ myObjA: null }),
  firebase: {
    myObjA: db.ref('myObjA'),
    asObject:true
  },
  computed: {
    appChart() {
      return {
        data: {
          labels: ["A"], 
          series: [[this.myObjA]]
        }
      }
    }
  }
}
</script>

Vue.js 上带有图表的 Vuefire

Vuefire with Chart on Vue.js

firebase

vue.js

vuejs2

vuefire

vuexfire