@nuxtjs/algolia
功能
- 輕鬆整合 Algolia
- 便捷的組合式函式，例如 useAlgoliaSearch、useAsyncAlgoliaSearch
- 支援 Vue Instantsearch 元件
- 支援 Algolia Recommend
- 支援 Docsearch
- 支援自動索引
- 支援快取請求和響應
- 支援 SSR 請求
預覽
設定
npx nuxi@latest module add algolia
基本用法
將 ALGOLIA_API_KEY 和 ALGOLIA_APPLICATION_ID 環境變數新增到 .env 檔案中。
ALGOLIA_API_KEY="0fd1c4eba2d831788333e77c9d855f1d"
ALGOLIA_APPLICATION_ID="AGN9HEEKF3"
現在你可以在你的應用中開始使用 @nuxtjs/algolia 了！
客戶端
<script setup lang="ts">
const { result, search } = useAlgoliaSearch('test_index')
onMounted(async () => {
await search({ query: 'Samsung' })
})
</script>
<template>
<div>{{ result }}</div>
</template>
或 SSR
<script setup lang="ts">
const { data } = await useAsyncAlgoliaSearch({ indexName: 'test_index', query: 'Samsung' })
</script>
<template>
<div>{{ data }}</div>
</template>
開發
- 克隆此倉庫
- 使用
yarn install或npm install安裝依賴項 - 使用
yarn dev:prepare或npm run dev:prepare來準備開發環境 - 使用
yarn dev或npm run dev啟動開發伺服器