iViewのメッセージ(グローバルヒント)と通知(通知アラート)グローバルコンフィギュレーション方法

iViewの通知コンポーネントとメッセージを使用しているときの表示フレーム長の設定の表示位置に促すことができます。

このiViewは、2つの構成プロパティを提供します。彼らは以下のとおりです。

  • 単位画素の上部の先端アセンブリ上の距離。
  • 期間は自動的秒の遅延をオフにします。

これらの2つのコンポーネントがグローバルに設定することができます。

//在某个组件中全局配置,只需要在mouted()钩子函数中写入
mounted() { this.$Message.config({ top: 100, duration: 3 }); this.$Notice.config({ top: 100, duration: 3 }); } //在整个项目中全局配置,需要在main.js中写入 Vue.prototype.$Message.config({ top: 100, duration: 3 }); Vue.prototype.$Notice.config({ top: 50, duration: 3 });

単に

グローバル登録のiView

import iView from 'iview'
Vue.use(iView) 

使用

マナーVUEアセンブリで

this.$Message.info('This is a info tip');
this.$Message.success('This is a success tip');
this.$Message.warning('This is a warning tip');
this.$Message.error('This is an error tip');

第二の方法のjsファイルを使用して

import { Message } from 'iview' Message.info('hello'); Message.success('hello'); Message.warning('hello'); Message.error('hello'); 

コンフィギュレーション

グローバルコンフィギュレーション

main.js

Vue.prototype.$Message.config({
  top: 70,
  duration:2
});

ローカル設定

設定されたローカル設定の高さが有効ではありません

this.$Message.info({
    content: 'I'll be gone in 10 seconds',
    duration: 10,
    closable: true
});

おすすめ

転載: www.cnblogs.com/matd/p/11535876.html