useGSheet

Composable useGSheet mengambil data array 2D mentah (any[][]) dari range sel yang ditentukan.

Composable ini membungkus Nuxt useFetch dengan keamanan server-side proxy, pemrosesan cache otomatis, dan perlindungan stampede lock.

Signature

function useGSheet<T = any>(
  range: string,
  options?: ComposablesOptions
): {
  data: Ref<T | null>
  pending: Ref<boolean>
  error: Ref<FetchError | null>
  refresh: () => Promise<void>
  execute: () => Promise<void>
  status: Ref<'idle' | 'pending' | 'success' | 'error'>
}

Parameter

Opsi

• sheet: Nama tab sheet (misal 'Sheet1') atau alias yang dikonfigurasi pada nuxt.config.ts.
• valueRenderOption: 'FORMATTED_VALUE' | 'UNFORMATTED_VALUE' | 'FORMULA'.
• query: String query GViz SQL (misal 'SELECT A, B WHERE C > 10').
• cache: Set ke false untuk bypass cache.
• cacheMaxAge: Override TTL cache dalam detik.
• transform: Fungsi transformasi data kustom.

Contoh Penggunaan

<script setup lang="ts">
// Mengembalikan matriks 2D dari nilai sel
const { data: rows, pending, error, refresh } = await useGSheet('A1:D10', {
  sheet: 'Sheet1'
})
</script>

<template>
  <div v-if="pending">Memuat data spreadsheet...</div>
  <div v-else-if="error">Error: {{ error.message }}</div>
  <div v-else>
    <button @click="refresh()">Refresh</button>
    <table>
      <tr v-for="(row, rIdx) in rows" :key="rIdx">
        <td v-for="(cell, cIdx) in row" :key="cIdx">
          {{ cell }}
        </td>
      </tr>
    </table>
  </div>
</template>