el-textarea自定义添加图标

`el-textarea`是Element UI库中的一个组件，它是一个用于编辑文本的区域，通常用于长文本输入。如果你想在`el-textarea`上自定义添加图标，可以通过CSS或者将图标包装在一个可以点击的元素（如`<i>`、`<button>`等），并将其放置在`el-textarea`的外部来实现。例如：

<template>
  <div>
    <el-textarea v-model="text" placeholder="请输入内容"></el-textarea>
    <button @click="addIcon">点击添加图标</button>
    <i class="custom-icon" :style="{ visibility: showIcon ? 'visible' : 'hidden' }">
      <!-- 按需替换为实际的图标，如使用Font Awesome： -->
      <fa-icon :icon="yourCustomIcon" />
    </i>
  </div>
</template>

<script>
import { ElButton, FaIcon } from "element-plus";
import "font-awesome/css/font-awesome.min.css";

export default {
  components: {
    ElButton,
    FaIcon,
  },
  data() {
    return {
      text: "",
      showIcon: false,
      yourCustomIcon: 'fas fa-paperclip', // 可更改为你想要显示的图标名
    };
  },
  methods: {
    addIcon() {
      this.showIcon = !this.showIcon; // 显示或隐藏图标
    },
  },
};
</script>

<style scoped>
.custom-icon {
  position: absolute;
  right: 10px; /* 根据需要调整位置 */
}
</style>

在这个例子中，当你点击按钮时，会切换`custom-icon`的可见性。你可以根据需求调整样式和图标。