Notification-类型通知 自定义图标icon

不同类型的通知

  ElNotification({
    title: 'Success',
    message: 'This is a success message',
    type: 'success', //warning info error
  })
}

---

自定义类型通知icon

import {CircleCheck} from '@element-plus/icons-vue'

  ElNotification({
      message:'我是通知',
      icon: CircleCheck, //自定义图标。 若设置了 type 则 icon 会被覆盖
      customClass: 'customClass',//自定义类名
  })


<style lang="scss"> //style部分需要去掉scoped,customClass样式才能生效
    .customClass{
        color: red;
    }
</style>

---

Style属性中Scoped

使得CSS样式就只能作用于当前的组件，从而防止在引用组件时子组件与父组件之间的样式相互干扰。