Signature
Import
- Component
- Plugin
To ensure optimal bundle sizes,
see Optimize build size.
Vue
About this widget
Theais-snippet
widget displays attributes in a shorter form (a snippet).
Snippeted attributes are also highlighted.
It uses Algolia’s snippeting feature
in combination with the ais-hits
or ais-infinite-hits
widgets.
To determine which attributes should be snippeted,
first set them from the Algolia dashboard,
the CLI,
or with the API (using the attributesToSnippet
parameter):
Vue
attributesToSnippet
,
you can also set the snippet’s size to a specific number of words (it defaults to 10).
For example, :attributesToSnippet="['description:5']
.
Examples
Basic usage
Vue
Access a nested property
Given this record:JSON
Vue
Props
The attribute of the record to snippet.
For deeply nested objects, specify a dot-separated value like
actor.bio
.Vue
The original
hit
object provided to the function.
For this to work, the provided object must have a _snippetResult[attribute].value
property.Vue
The name of the HTML element to wrap the highlighted parts of the string.
Vue
HTML output
HTML