mirror of
https://github.com/element-plus/element-plus.git
synced 2026-03-13 07:51:17 +08:00
ea926472df
* feat(components): [input] textarea supports clearing effects * Update packages/components/input/__tests__/input.test.tsx Co-authored-by: rzzf <cszhjh@gmail.com> * feat: update * Apply suggestions from code review Co-authored-by: Noblet Ouways <91417411+Dsaquel@users.noreply.github.com> * Apply suggestions from code review Co-authored-by: Noblet Ouways <91417411+Dsaquel@users.noreply.github.com> * style: update * Update packages/components/input/src/input.vue Co-authored-by: rzzf <cszhjh@gmail.com> --------- Co-authored-by: rzzf <cszhjh@gmail.com> Co-authored-by: Noblet Ouways <91417411+Dsaquel@users.noreply.github.com>
34 lines
642 B
Vue
34 lines
642 B
Vue
<template>
|
|
<div class="input-group">
|
|
<el-input
|
|
v-model="input"
|
|
clearable
|
|
:clear-icon="CloseBold"
|
|
placeholder="Custom clear icon"
|
|
/>
|
|
<el-input
|
|
v-model="textareaInput"
|
|
clearable
|
|
:clear-icon="CloseBold"
|
|
placeholder="Custom clear icon"
|
|
type="textarea"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref } from 'vue'
|
|
import { CloseBold } from '@element-plus/icons-vue'
|
|
|
|
const input = ref('Custom clear icon')
|
|
const textareaInput = ref('Custom clear icon')
|
|
</script>
|
|
|
|
<style scoped>
|
|
.input-group {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 1em;
|
|
}
|
|
</style>
|