引入

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

Vue.use(Notify);

代碼演示

基礎(chǔ)用法

Notify('通知內(nèi)容');

通知類型

支持primary、success、warning、danger四種通知類型，默認(rèn)為danger

// 主要通知
Notify({ type: 'primary', message: '通知內(nèi)容' });

// 成功通知
Notify({ type: 'success', message: '通知內(nèi)容' });

// 危險(xiǎn)通知
Notify({ type: 'danger', message: '通知內(nèi)容' });

// 警告通知
Notify({ type: 'warning', message: '通知內(nèi)容' });

自定義通知

自定義消息通知的顏色和展示時(shí)長

Notify({
  message: '自定義顏色',
  color: '#ad0000',
  background: '#ffe1e1'
});

Notify({
  message: '自定義時(shí)長',
  duration: 1000
});

組件內(nèi)調(diào)用

引入 Notify 組件后，會(huì)自動(dòng)在 Vue 的 prototype 上掛載 $notify 方法，便于在組件內(nèi)調(diào)用。

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

API

方法

Options