search

kurotanshi / vue-ubike-information

YouBike 臺北市公共自行車即時資訊
2 stars 41 forks source link

組件作業 #30

Closed MiyaJhang closed 4 years ago

MiyaJhang commented 4 years ago

老師抱歉, 剛剛傳錯branch @@

MiyaJhang commented 4 years ago

我將組件拆開, 遭遇到一些困境 因此想向老師請教, 在UbikeTable.vue我想做回傳sortedUbikeStops的資料到App.vue給Pagination.vue使用, 在Pagination.vue我想做回傳totalPageCount的資料到App.vue給UbikeTable.vue使用, 我想使用mitt做資料傳遞, 但範例都是使用button的作法, 有機會不使用button就做傳送嗎?

kurotanshi commented 4 years ago

我將組件拆開, 遭遇到一些困境 因此想向老師請教, 在UbikeTable.vue我想做回傳sortedUbikeStops的資料到App.vue給Pagination.vue使用, 在Pagination.vue我想做回傳totalPageCount的資料到App.vue給UbikeTable.vue使用, 我想使用mitt做資料傳遞, 但範例都是使用button的作法, 有機會不使用button就做傳送嗎?

是可以不需要透過 button 來做傳送，看你事件怎麼訂閱/觸發。

例如你在 App.vue 的 create hook 裡面，可以先向 bus 註冊 change-page 事件:

bus.on('change-page', function (value) { /* 略 */ })

然後在你想要觸發事件的地方，執行:

bus.emit('change-page', value)

把 value 送到 change-page 事件的 callback function 即可。

以 Pagination.vue 的角度來說，它應該不需要知道目前是怎麼排序， 它只要知道目前列表的總筆數，這樣就可以算出總共有幾頁了。

另一方面，對 UbikeTable.vue 來說，它需要知道的應該不是 totalPageCount 而是目前所在頁數 (我記得我的範例是叫 currentPage)，以及單一頁面顯示的筆數 COUNT_OF_PAGE，這樣才能算出列表的陣列該怎麼切割出來。

MiyaJhang commented 4 years ago

謝謝老師的解說, 我嘗試看看!