<template>
   <Input 
        v-bind='$attrs'
        clearable
        :placeholder='props.placeholder'
        :value="myValue"
        @$changed:value="onChange"
        @keyup.enter="onSearch"
        @clear ='onClear'
    >
        <template v-slot:suffix><Icon class="k-icon-search" @click="onSearch" hoverable /></template>
    </Input>
</template>
<script setup>
import { onMounted, ref } from 'vue';
import { Input,Icon } from '@king-design/vue';
import  {map,get,find,findIndex,forEach,isObject,} from 'lodash-es';
const props = defineProps({
    placeholder: String,
});
const myValue = ref('')
// 接收父组件声明的方法
const emit = defineEmits(['onTransValue'])
const onChange = (val) => {
    myValue.value = val
}
const onClear = () => {
  _reset()
  onSearch()
}
const _reset = () => {
    myValue.value = ''
}
const onSearch = () => {
    emit('onTransValue',myValue.value)
}
defineExpose({
    onChange,
    _reset
})

</script>

<style scoped lang="less">

</style>
