程序员

element-plus Form-Item 插槽 使用

2022-03-09  本文已影响0人  wcmszgdqm

<el-form><el-form-item> 自定义 label ,通过插槽方式实现

最终要达到的效果,输入框前面的文字部分增加提示信息图标。

图片.png
<el-form-item>
    <template #label>
    商品编号
    <el-popover
      placement="top"
      :width="200"
      effect="dark"
      trigger="click"
      content="编号说明可以看到 element 提供的弹出框没有提供换行的功能"
    >
      <template #reference>
        <el-icon style="vertical-align: sub; cursor: pointer"
          ><Warning
        /></el-icon>
      </template>
    </el-popover>
  </template>
  <template #default>
    <el-input v-model="formSearch.goodsId" placeholder="">
    </el-input
  ></template>
</el-form-item>
上一篇 下一篇

猜你喜欢

热点阅读