Message 消息提示

常用于主动操作后的反馈提示

效果

默认：3s后自动消失

自定义延时：10s自动消失

关闭回调

使用示例

// template
<button class="primary" @click="handleInfo('这是一条普通消息，会主动消失')">提示</button>
<button class="warning" @click="handleWarning('这是一条警告消息，会主动消失')">警告</button>
<button class="error" @click="handleError('这是一条失败消息，会主动消失')">错误</button>
<button class="success" @click="handleSuccess('这是一条成功消息，会主动消失')">成功</button>
<button @click="handleDelay('十秒钟后会消失')">延时</button>
<button class="primary" @click="handleOnClose()">关闭回调</button>
// script
methods: {
  handleInfo(msg) {
    this.$message.info(`提示：${msg}`);
  },
  handleSuccess(msg) {
    this.$message.success(`成功：${msg}`);
  },
  handleWarning(msg) {
    this.$message.warning(`警告：${msg}`);
  },
  handleError(msg) {
    this.$message.error(`错误：${msg}`);
  },
  handleDelay(msg) {
    this.$message.info({
      message: `提示：${msg}`,
      duration: 10000
    });
  },
  handleOnClose(msg) {
    this.$message.info({
      message: "消失后弹出alert框",
      onClose: () => {
        this.$nextTick(() => {
          this.$message.success('OnClose!')
        })
      }
    })
  }
}

参数

参数	说明	类型	默认值	可选值
type	类型	String	info	info,warning,error,success
message	提示文案	String	-	-
duration	关闭延时	Number	3000	-
onClose	关闭回调	Function	-	-