33 lines
530 B
Vue
33 lines
530 B
Vue
<template>
|
|
<form>
|
|
<input type="search" @input="search" :value="searchTerm" placeholder="Filter items" />
|
|
</form>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: ['searchTerm'],
|
|
emits: ['search'],
|
|
methods: {
|
|
search(event) {
|
|
this.$emit('search', event.target.value);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
input {
|
|
font: inherit;
|
|
width: 100%;
|
|
display: block;
|
|
padding: 0.15rem;
|
|
border: 1px solid #ccc;
|
|
}
|
|
|
|
input:focus {
|
|
outline: none;
|
|
border-color: #00006b;
|
|
background-color: #eeeeff;
|
|
}
|
|
</style> |