34 lines
667 B
Vue
34 lines
667 B
Vue
<template>
|
|
<div class="root">
|
|
<p>Showing {{ filteredTitles.length }} results for "{{ query }}"</p>
|
|
<ul>
|
|
<p v-for="title in filteredTitles" :key="title.Page">
|
|
<a :href="title.Page" target="_blank">{{ title.Name }}</a>
|
|
</p>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import titles from "../post-data.json";
|
|
import { computed } from "vue";
|
|
|
|
export default {
|
|
props: {
|
|
query: String,
|
|
},
|
|
|
|
setup(props, context) {
|
|
const filteredTitles = computed(() => {
|
|
return titles.filter((s) =>
|
|
s.Name.toLowerCase().includes(props.query.toLowerCase())
|
|
);
|
|
});
|
|
|
|
return {
|
|
filteredTitles,
|
|
}
|
|
},
|
|
};
|
|
</script>
|