element的input设置readonly不能使用清除按钮，怎么设置不可输入，但可以显示清除按钮？

Question

有功能要求选择一个用户，由于element ui自带的下拉选择组件不满足开发需要（有分页，还可能带复杂的搜索），所以我制作一个基于查询用户数据表的业务性质的下拉选择组件，

组件内部使用el-popover和el-input组合而成，el-popover内部显示数据表格，使用el-table，表格下面带分页，上面带搜索筛选操作。el-input显示选择的用户名。

我设置了el-input的readonly为只读，但我发现无法像el-select一样，显示清除按钮。这个怎么解决，除了自己制作一个input组件外，有什么方法解决？

Answer 1

你自己加个icon啰，下面这样👇

<el-input
  placeholder="请输入内容"
  v-model="input"
  :disabled="true"
  suffix-icon="el-icon-circle-close"
>
</el-input>

Answer 2

在el-input mounted时获取到内部的input元素，手动设置readonly