vue.js - Vue-Apollo - クエリの結果にアクセスできません

Question

アポロ クエリの結果オブジェクトにアクセスできません。結果を使用して、plot.ly グラフに表示したいと考えています。

const apolloClient = new Apollo.lib.ApolloClient({
  networkInterface: Apollo.lib.createNetworkInterface({
    uri: '{% url 'graphql' %}',
    transportBatching: true,
  }),
  connectToDevTools: true,
})

const apolloProvider = new VueApollo.ApolloProvider({
  defaultClient: apolloClient,
})

const VALUE_QUERY = Apollo.gql`
query {
  allSensordata {
    id
    value
  }
}
`

これは、plot.ly で使用するための Vue コンポーネントです。

//VueJS Component
Vue.component("reactive-chart", {
  props: ["chart"],
  template: '<div :ref="chart.uuid" style="width:600px;height:250px;"></div>',
  mounted() {
    Plotly.plot(this.$refs[this.chart.uuid], this.chart.traces, this.chart.layout);
  },
  watch: {
    chart: {
      handler: function() {
        Plotly.react(
          this.$refs[this.chart.uuid],
          this.chart.traces,
          this.chart.layout
        );
      },
      deep: true
    }
  }
});

これは、apollo graphql の結果をグラフに表示したい Vue メイン コードです。

//VueJS Main App
var app = new Vue({
  delimiters: ['[[', ']]'],
  el: "#app",
  // Apollo GraphQL
  apolloProvider,
  apollo: {
    allSensordata: {
      query: VALUE_QUERY,
      loadingKey:'loading',
    },
  },
  data() {
    return {
      loading: 0,
      chart: {
        uuid: "123",
        traces: [
          {
            y: [1,2,3,4,3,2,1], //Here should be: this.allSensordata.value
            line: {
              color: "#5e9e7e",
              width: 4,
              shape: "line"
            }
          }
        ],
        layout: {}
      }
    };
  },
});

Apollo-module のオブジェクト構造を取得できていないと思います。ご協力いただきありがとうございます！