Provides pre-built UI components following best practice principles for Vue that remain independent from external frameworks
Integrate into your existing UI or app, or use InstantSearch templates
Comes with a default CSS theme, completely customizable
Manages all business logic for search requests, responses, and states
Progressive customization of components (use, extend, or customize)
Compatible with all current versions of the underlying <JavaScrip>t library
Code is entirely open source and available on GitHub
Bootstrap your application, with create-instantsearch-app, NPM, ...
TEMPLATE (GET A FREE ACCOUNT HERE)
<template>
<ais-instant-search :search-client="searchClient" index-name="demo_ecommerce">
<ais-search-box />
<ais-hits>
<template v-slot:item="{ item }">
<h2>{{ item.name }}</h2>
</template>
</ais-hits>
</ais-instant-search>
</template>
CSS
<style>
body {
font-family: sans-serif;
padding: 1em;
}
</style>
SEARCH
<script>
import algoliasearch from 'algoliasearch/lite';
import 'instantsearch.css/themes/satellite-min.css';
export default {
data() {
return {
searchClient: algoliasearch(
'B1G2GM9NG0',
'aadef574be1f9252bb48d4ea09b5cfe5'
),
};
},
};
</script>