Vue.js > Accessing draft/updated content

If you have draft/published mode enabled on some of your models, you can add the X-Include-Drafts header to your requests to access records at their latest version available, instead of the currently published one:

export function request({ query, variables, includeDrafts }) {
  const headers = {
    authorization: 'Bearer ...',
  };
  
  if (includeDrafts) {
    headers['X-Include-Drafts'] = 'true';
  }
  const client = new GraphQLClient('https://graphql.datocms.com/', { headers });
  // ...
}
// Then in your Vue.js component setup script:
const data = ref(null);
onMounted(async () => {
  data.value = await request({
    query: yourQuery,
    includeDrafts: true
  });
})