Algolia InstantSearch Hide Pagination if Only 1 Page (Vue.js)

August 19, 2020
<template>
  <ais-instant-search
    :search-client="searchClient"
    index-name="live"
  >

    <ais-state-results>
      <template slot-scope="{ state: { query }, results: { hits, nbPages } }">
        <!-- show no result if query with no hits -->
        <div v-if="query && hits.length == 0">No results</div>
        <div v-else></div>

        <!-- hide pagination if 1 or less pages -->
        <ais-pagination v-if="nbPages > 1"/>
      </template>
    </ais-state-results>

  </ais-instant-search>
</template>

NOTE: Refer to Setup Algolia InstantSearch on Nuxt/Vue for complete code.

This work is licensed under a
Creative Commons Attribution-NonCommercial 4.0 International License.