Vue提示框組件vue-notification使用詳解
先看下演示效果：
安裝方法：
通過 npm install vue-notification 就能使用了。
導(dǎo)入方法：
import Notifications from 'vue-notification'; Vue.use(Notifications);
引用方法：
this.$notify({
type: 'success',
title: '提示：',
text: '參數(shù)保存成功！'
});并且需要在 App.vue 里加入 <notifications position="top right" duration=4 /> 。
其中 duration 參數(shù)為持續(xù)時(shí)間。
position 參數(shù)為提示位置，前面的值為縱向的頂部 top 和底部 bottom，后面的值為橫向的左 left、中 center、右 right。
覺得 top 太靠上的話，
可以加個(gè) css 調(diào)整下位置。
/* 設(shè)置提示框顯示位置 */
.vue-notification-group{
top: 10% !important;
}更多參數(shù)：
到此這篇關(guān)于Vue提示框組件vue-notification使用的文章就介紹到這了,更多相關(guān)Vue提示框vue-notification內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
vue.js click點(diǎn)擊事件獲取當(dāng)前元素對(duì)象的操作
這篇文章主要介紹了vue.js click點(diǎn)擊事件獲取當(dāng)前元素對(duì)象的操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-08-08
在vue項(xiàng)目實(shí)現(xiàn)一個(gè)ctrl+f的搜索功能
剛剛接到領(lǐng)導(dǎo)通知，需要實(shí)現(xiàn)搜索功能，因?yàn)轫?xiàng)目是vue的而且是手機(jī)端，對(duì)我來說有點(diǎn)小難度。經(jīng)過小編的一番思索最終還是解決了，今天小編把實(shí)現(xiàn)過程分享到腳本之家平臺(tái)，需要的朋友參考下2020-02-02
Vue為何棄用Ajax，選擇Axios？ajax與axios的區(qū)別？
ajax技術(shù)實(shí)現(xiàn)了局部數(shù)據(jù)的刷新，axios實(shí)現(xiàn)了對(duì)ajax的封裝；axios有的ajax都有，ajax有的axios不一定有?？偨Y(jié)一句話就是axios是ajax，ajax不止axios。2023-01-01
element表單驗(yàn)證如何清除校驗(yàn)提示語
本文主要介紹了element表單驗(yàn)證如何清除校驗(yàn)提示語，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-10-10
vue自定義橫向滾動(dòng)條css導(dǎo)航兩行排列布局實(shí)現(xiàn)示例
這篇文章主要為大家介紹了vue自定義橫向滾動(dòng)條css導(dǎo)航兩行排列布局實(shí)現(xiàn)示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08
Vue實(shí)現(xiàn)登錄功能全套超詳細(xì)講解(含封裝axios)
這篇文章主要給大家介紹了關(guān)于Vue實(shí)現(xiàn)登錄功能(含封裝axios)的相關(guān)資料,Vue是現(xiàn)在前端最流行的框架之一,作為前端開發(fā)人員應(yīng)該要熟練的掌握它,需要的朋友可以參考下2023-10-10
vue實(shí)現(xiàn)數(shù)字滾動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)數(shù)字滾動(dòng)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-06-06
vue實(shí)現(xiàn)滑動(dòng)和滾動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)滑動(dòng)和滾動(dòng)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
uni-app自定義導(dǎo)航欄按鈕|uniapp仿微信頂部導(dǎo)航條功能
這篇文章主要介紹了uni-app自定義導(dǎo)航欄按鈕|uniapp仿微信頂部導(dǎo)航條,需要的朋友可以參考下2019-11-11
這篇文章主要給大家介紹了關(guān)于少女風(fēng)vue組件庫的制作全過程，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用vue具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05