1
<template>
2
  <div v-if="data">
3
    <h1>{{ data.movie.title }}</h1>
4
    <!-- .. -->
5
  </div>
6
</template>
7

8
<script>
9
import axios from 'axios'
10

11
function request({ query, preview }) {
12
  const endpoint = preview
13
    ? `https://graphql.datocms.com/preview`
14
    : `https://graphql.datocms.com/`
15

16
  const response = await axios.post(endpoint, { query });
17
  return response.data.data;
18
}
19

20
export default {
21
  data() {
22
    return {
23
      data: null
24
    };
25
  },
26
  async mounted() {
27
    this.data = await request({
28
      query: `{
29
        movie(filter: { title: { eq: "Inception" } }) {
30
          title
31
          releaseDate
32
          actors {
33
            name
34
          }
35
        }
36
      }`
37
    });
38
  }
39
};
40
</script>