el-input 怎么添加鼠标悬浮内容展示

您可以通过使用el-tooltip组件的content属性将提示框附加到el-input中。然后，您可以添加一个文本框和图标，当鼠标悬停在这些元素上时，提示框就会显示。

以下是示例代码：

<template>
  <div>
    <el-input v-model="inputValue"
              :placehoder="placeholder"
              suffix-icon="el-icon-question"
              @mouseover.native="showTooltip = true"
              @mouseout.native="showTooltip = false">
      <template #suffix>
        <el-tooltip placement="top" content="这是提示内容" :disabled="!showTooltip" :offset="[0, 8]">
          <i class="el-icon-question"></i>
        </el-tooltip>
      </template>
    </el-input>
  </div>
</template>

<script>
export default {
  data() {
    return {
      inputValue: '',
      placeholder: '请输入内容',
      showTooltip: false
    }
  },
}
</script>

在这个示例中，我们为el-input添加了@mouseover.native和@mouseout.native事件侦听器，以便在用户鼠标悬停和移开时显示和隐藏提示框。

提示框使用el-tooltip组件，并将其插入到el-input的suffix插槽中。如果您想在输入框左边或右边显示提示框，请将placement属性设置为相应的位置（例如，left或right）。

如果要更改提示框的样式或其他属性，可以在el-tooltip组件上使用相应的属性。

希望这个答案对您有所帮助，如果还有问题，请随时询问。