饿了么的鼠标滑过hover显示图文的方法

1. hover之后显示文字

  <el-popover
    placement="top-start"
    title="标题"
    width="200"
    trigger="hover"
    content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。">
    <el-button slot="reference">hover 激活</el-button>
  </el-popover>

2. hover之后显示图片

        <!-- 卡片名称 -->
        <el-popover placement="top-start" width="400" trigger="hover">
          <!-- 扫一扫示例 -->
          <div class="imgPanelyindao">
            <!-- hover的图片 -->
            <img
              src="@/assets/webimg/logyindao.png"
              style="width: 375px; height: 414px"
            />
          </div>
          <!-- 被hover的图片 -->
          <img
            style="width: 24px; height: 24px; margin-top: 39px"
            slot="reference"
            src="@/assets/bangzhu.png"
          />
        </el-popover>

3. 参考element组件

element的弹出框组件