elementui提示

使用Element UI的提示功能

Element UI提供了ElMessage、ElNotification等组件用于显示提示信息。这些组件可以全局调用，适用于各种场景。

安装Element UI后，在项目中引入需要的组件：

import { ElMessage, ElNotification } from 'element-plus'

基本消息提示

使用ElMessage显示普通提示：

ElMessage('这是一条普通消息')

带类型的消息提示：

ElMessage.success('成功消息')
ElMessage.warning('警告消息')
ElMessage.error('错误消息')

通知提示

使用ElNotification显示更复杂的通知：

ElNotification({
  title: '标题',
  message: '这是一条通知内容',
  type: 'success',
  duration: 3000
})

自定义配置

可以配置提示的显示时间和位置：

ElMessage({
  message: '自定义消息',
  type: 'info',
  duration: 5000,
  offset: 100,
  center: true
})

全局配置

在Vue应用中可以设置全局默认值：

app.config.globalProperties.$message = ElMessage
app.config.globalProperties.$notify = ElNotification

手动关闭提示

某些情况下需要手动关闭提示：

const msg = ElMessage({
  message: '可关闭的消息',
  showClose: true
})

// 手动关闭
msg.close()