javascript - vue 寫一個組件和寫一個插件有什么區別?
問題描述
現在想寫一個分頁的東西,但是拿不定是寫成一個.vue單文件好還是用install寫成一個插件好,不太清楚2者之間的區別,感覺.vue就能解決需求,但是為什么要有install這個方式呢,另外有一個關于install寫插件的問題
//pagetion的模版 <template> <p class='paging'><p name='pagingPage'> <li> <span class='paging-first'></span> </li> <li v-for='item in numArr'> <span class='paging-next'>{{item}}</span> </li> <li> <span class='paging-last'></span> </li></p> </p> </template>//這個是install寫插件 let paging = { install: function(Vue, options) {Vue.component(’pagination’,pagination); } }
我install里面的options配置參數如何傳遞到pagetion的模版里面去呢?
問題解答
回答1:Vue 的組件是模板和 UI 邏輯的結合。
如果分頁邏輯在許多組件之間需要復用,那么最好的方式顯然是通過插件復用 Vue 文件的 JS 邏輯。
如果分頁邏輯只在一個組件中用到,那么使用插件和 mixins 會降低單個 Vue 組件的可讀性。
回答2:一個Vue插件可以是一堆Vue組件的集合(插件干的事就是把內部的組件幫你倒入到vue全局下),也可以是用來擴展Vue功能的,比如 Vuex, Vue-Router。你也可以寫一個插件,在Vue原型上擴展方法,要實現這個需求絕對沒法寫成組件。
let whatever = { install: function(Vue, options) {Vue.prototype.$whatever = function(){ // do something }; } } // 你這個用組件咋搞?
另外,你為啥要在install插件的時候決定插件倒入的組件的數據呢?那不是應該你在用這個組件的時候通過props來控制么?
相關文章:
1. html5 - 如何實現帶陰影的不規則容器?2. node.js - 在vuejs-templates/webpack中dev-server.js里為什么要exports readyPromise?3. javascript - 循環嵌套多個promise應該如何實現?4. mysql優化 - 關于mysql分區5. css - 移動端字體設置問題6. objective-c - iOS開發支付寶和微信支付完成為什么跳轉到了之前開發的一個app?7. css3 - rem布局下,用戶瀏覽器的最小字號是12px怎么辦?8. vue.js - vue 打包后 nginx 服務端API請求跨域問題無法解決。9. 前端 - IE9 css兼容問題10. javascript - ionic2 input autofocus 電腦成功,iOS手機鍵盤不彈出
