Vant Notify 消息提示

引入

import Vue from "vue";
import { Notify } from "vant";

Vue.use(Notify);

代码演示

基础用法

Notify("通知内容");

通知类型

支持primary、success、warning、danger四种通知类型，默认为danger

// 主要通知
Notify({ type: "primary", message: "通知内容" });

// 成功通知
Notify({ type: "success", message: "通知内容" });

// 危险通知
Notify({ type: "danger", message: "通知内容" });

// 警告通知
Notify({ type: "warning", message: "通知内容" });

自定义通知

自定义消息通知的颜色和展示时长

Notify({
  message: "自定义颜色",
  color: "#ad0000",
  background: "#ffe1e1"
});

Notify({
  message: "自定义时长",
  duration: 1000
});

组件内调用

引入 Notify 组件后，会自动在 Vue 的 prototype 上挂载 $notify 方法，便于在组件内调用。

export default {
  mounted() {
    this.$notify("提示文案");
  }
}

API

方法

Options