Vue被一個安康的插件和包的生態體例所鞏固,使開拓變得真實、趕快和大略。因為Vue是一個國際開拓者社區所采用的框架,以是有一個連接延長的插件和包庫,你不妨在名目中運用。正文陳列了用來Vue2和Vue3的15個時髦的Vue插件。
VuetifyNuxtJSVuexVuexPersistedStateVuePressVueMetaVueChartJSVueGridLayoutVueDraggableVee-ValidateVueToastificationVueTourSwiper.jsVue2-LeafletTroisJSVueScrollamaVueQRCodeReaderVuetify
教程:https://www.vuemastery.com/courses/beautify-with-vuetify/getting-started-with-vuetify
你能否曾糾結于怎樣讓運用在視覺上看上去更招引人?Vuetify是一個鑒于MaterialDesign的UI庫,扶助谷歌和Android的安排談話。
它是一個開源庫,罕見百個組件,從按鈕,appbars,chips,modals和更多。那些組件都是預先安排好的,特殊適用,讓你不妨經過文書檔案化的props和插槽與它們舉行交互。預先設置的CSS類也可用來遏制臉色、字體、網格間距、彈性框等。
NuxtJS
Nuxt鑒于一個宏大的模塊化框架結構。你不妨從50多個模塊中舉行采用,讓你的開拓變得更快、更大略。對PWA的扶助、增添谷歌領會到你的網頁或天生網站輿圖,那些功效都無需從新創造輪子來贏得。
NuxtJS暫時鑒于Vue2。然而nux3邇來仍舊頒布,而且仍舊實足重寫以扶助Vue3。
Vuex
Vuex是一個專為Vue.js運用步調開拓的狀況處置形式。它沿用集選取保存管理當用的一切組件的狀況,并以相映的準則保護狀況以一種可猜測的辦法爆發變革。Vuex也集成到Vue的官方調節和測試東西devtoolsextension(opensnewwindow),供給了諸如零擺設的time-travel調節和測試、狀況快速照相導出導出等高檔調節和測試功效。
VuexPersistedState
Vuex狀況體制,一革新就會重置,處置題目的辦法普遍都是保存起來(session/localStorage),vuex-persistedstate插件幫咱們集成了那些功效。
VuePress
VuePress是一款運用Vue啟動的靜態網站天生器,是Vue的作家EvanYou為了簡單文書檔案的編寫而開拓的。
默許中心與Vue官方文書檔案普遍簡略,少擺設,高本能Markdown專為本領文書檔案供給拓展自帶PWA自設置中心,可定制水平實足由本人確定VueMeta
地方:https://vue-meta.nuxtjs.org/
鑒于Vue2.0的vue-meta插件,重要用來處置HMTL頭地標簽,同聲也扶助SSR。
vue-meta有以次特性:
在組件內樹立metaInfo,便可輕快實行頭地標簽的處置metaInfo的數據都是相應的,即使數據變革,頭部消息會機動革新扶助SSRVueChartJS
地方:https://www.npmjs.com/package/vue-chartjs
想在你的Vue運用步調中增添圖表?不妨看看Chart.js。它是一個為安排師和開拓者供給的大略而精巧的JS圖表庫。它有很多美麗的圖表典型可供采用。
地方:https://jbaysolutions.github.io/vue-grid-layout/
VueGridLayout是一個一致于Gridster的柵格構造體例,實用于Vue.js,靈感根源于ReactGridLayout。
個性
可拖拽可安排巨細靜態元件(不行拖拽、安排巨細)拖拽和安排巨細時舉行邊境查看增減元件時制止重修柵格可序列化和恢復的構造機動化RTL扶助相應式VueDraggable
地方:https://www.npmjs.com/package/vuedraggable
Vue.Draggable是一款鑒于Sortable.js實行的vue拖拽插件。扶助挪動擺設、拖拽和采用文本、智能震動,不妨在各別列表間拖拽、不依附jQuery為普通、vue2過度動畫兼容、扶助廢除操縱,總之是一款特殊特出的vue拖拽組件。
Vee-Validate
地方:https://www.npmjs.com/package/vee-validate
為了保證經過表單從用戶何處搜集精確典型的數據,有需要考證表單,以保證用戶輸出適合預期的形式。VeeValidate是一個不妨將這一層功效增添就任何表單組件的包。
VueToastification
地方:https://vue-toastification.maronato.dev/
VueToastification是一個輕量、易用且場面的提醒條報告組件,供給了洪量的選項來扶助大局部自設置采用。
VueTour
地方:https://github.com/pulsardev/vue-tour
VueTour是靈巧、大略且可自設置的生人引導插件,可與Vue.js一道運用。它供給了一種趕快簡單的本領來引導用戶運用您的運用步調。
Swiper.js
地方:https://swiperjs.com/vue
Swiper.js是一個預制的回旋蹺蹺板組件,不妨用來在百般圖片之間滑行。Swiper.js原生扶助Vue3,供給了一個不妨插入到你的項手段組件。對于Vue2,你不妨運用其余包,如vue-awesome-swiper。
vue2-leaflet
地方:https://www.npmjs.com/package/vue2-leaflet
vue2-leaflet是對ledflet的封裝,vue名目市直接運用vue2-leaflet即可。Leaflet.js是一個開源庫,運用它不妨安置交互式,大略,輕量級和大略的Web輿圖。
TroisJS
地方:https://troisjs.github.io/
Trois(法語為Three)是一個Vue3庫,用來Three.JS,這是一個時髦的WebGL庫。
Three.JS對桌面和挪動端都有杰出的扶助。這個庫承諾你運用VueJS組件為你的網站輕快創造3D實質。你不妨運用這個庫在你的網站上增添一個3D襯托器,并在你的VueJs文獻的<template>局部中運用預先創造的組件指定場景詳細,如資料、照明、網格、暗影等。
Trois.Js是Three.js上頭的一個包裝器,所以不比原始庫慢。它還經過機動處治好多體、資料、紋理、襯托器等來簡化東西的處治,這在原始庫中是不生存的。
vue-scrollama
地方:https://www.npmjs.com/package/vue-scrollama
一個Vue組件,可輕快樹立震動啟動的交互(又稱震動報告)。在引擎蓋下運用Scrollama。
VueQRCodeReader
地方:https://gruhn.github.io/vue-qrcode-reader/demos/CustomTracking.html
QR碼(QRcode)在現在寰球特殊一致。Vue二維碼觀賞器是一個即插即用的包,承諾你增添二維碼掃描功效到你的運用步調。