Yêu cầu Oct 27th, 2020 5:22 p.m. 141 0 2
  • 141 0 2
+1

Hỏi về cách xử lý router trong nuxtjs

Chia sẻ
  • 141 0 2

Chào mọi người. Mình đang muốn xử lý trang đọc bài viết chi tiết như kiểu này: 9to5mac-daily-october-27-2020

Khi kéo xuống đọc hết bài thì sẽ hiện ra các bài gợi ý như hình này:

Click vào button EXPAND FULL STORY để đọc tiếp bài mới. Khi đó nó thay đổi url slug rồi hiển thị tiếp content bài mới trong cùng 1 trang luôn. Thì sẽ xử lý trong nuxtjs như thế nào? Mình cảm ơn

2 CÂU TRẢ LỜI


Đã trả lời Oct 29th, 2020 1:02 a.m.
Đã được chấp nhận
0

@bacode Bên nhớ không nhầm thì vue-router ko có shallow giống bên next.js. Việc dùng $router.replace như ở dưới mình chia sẻ mà không được thì bạn thử dùng cách này xem:

window.history.pushState(
  null,
  null,
  `/new-url`
)
Chia sẻ
Đã trả lời Oct 28th, 2020 1:31 a.m.
+2

Mình giả định là khi click nút EXPAND FULL STORY thì bạn sẽ lấy full nội dung của bài viết đó qua API, hoặc bằng một cách nào đó khác sau đó hiển thị nội dung full này thay thế đoạn nội dung ngắn. Lúc này bạn đang cần đổi cái URL nữa thôi. Trường hợp này bạn thử dùng hàm replace có lẽ là phù hợp, khi đó nội dung trang vẫn giữ nguyên được và URL sẽ thay đổi:

this.$router.replace()

https://router.vuejs.org/guide/essentials/navigation.html#router-replace-location-oncomplete-onabort

Chia sẻ
Oct 28th, 2020 2:26 a.m.

@huukimit replace() thì cách thức hoạt động cũng giống router push mà nhỉ b? Như thế thì nó sẽ chuyển url rồi chạy cái asyncData và thay thế nội dung cũ rồi mà nhỉ?

Oct 28th, 2020 2:27 a.m.

@huukimit mình thấy bên next có cái shallow routing có thể làm đc. Bên nuxt ko biết có cái nào tương tự thế ko?

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí