32 lines
943 B
Vue
32 lines
943 B
Vue
<template>
|
|
<div class="input-group mb-3 d-flex">
|
|
<input type="text" class="form-control" placeholder="Search" @change="search" @input="preventLeadingSpace" />
|
|
<button type="button" class="btn btn-primary"><i class="bx bx-search bx-md"></i></button>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
const props = defineProps({
|
|
maxlength: {
|
|
type: Number,
|
|
default: 30,
|
|
required: false,
|
|
},
|
|
});
|
|
|
|
const emits = defineEmits(['update:data']);
|
|
|
|
const search = function (event) {
|
|
|
|
//Type Number 일때 maxlength 적용 안됨 방지
|
|
if (event.target.value.length > props.maxlength) {
|
|
event.target.value = event.target.value.slice(0, props.maxlength);
|
|
}
|
|
emits('update:data', event.target.value);
|
|
};
|
|
|
|
const preventLeadingSpace = function (event) {
|
|
event.target.value = event.target.value.trimStart();
|
|
}
|
|
</script>
|