扩展组件之2：初尝组件扩展封装，删除提示组件popoverDelete

最新推荐文章于 2023-09-26 14:41:46 发布

原创

最新推荐文章于 2023-09-26 14:41:46 发布 · 516 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue #element-ui

本文将介绍如何利用Element UI的Popover组件封装一个用于删除提示的组件，详细讲解了组件的配置属性、事件触发及使用示例。主要知识点包括slot的使用和$emit事件。

今天我们来封装一个很简单，但是又非常好用的组件

利用element-ui的Popover 弹出框组件，来进行封装，做出一个删除确认提示组件

效果图

在我的上传组件中就有用到这个组件

源码

<template>
    <div style="display: inline-block;">
        <el-popover
                ref="popover"
                :placement="placement"
                :width="width"
                v-model="visible">
            <p style="padding: 8px 8px 16px 8px"><slot name="message">确定要删除吗？</slot></p>
            <div style="text-align: center; margin: 0">
                <el-b