<input bind:value=search>
{#each items.filter(predicate) as word}
<p><strong>{word.slice(0, search.length)}</strong>{word.slice(search.length)}</p>
{:else}
<p>no matches!</p>
{/each}
<script>
export default {
computed: {
predicate: ({ search }) => {
search = search.toLowerCase();
return word => word.startsWith(search);
}
}
};
</script>
xxxxxxxxxx
{
search: "",
items: [
"about",
"above",
"abuse",
"actor",
"acute",
"admit",
"adopt",
"adult",
"after",
"again",
"agent",
"agree",
"ahead",
"alarm",
"album",
"alert",
"alike",
"alive",
"allow",
"alone",
"along",
"alter",