Yêu cầu thg 4 13, 2020 9:16 SA 570 0 2
  • 570 0 2
0

vuejs: làm trang admin

Chia sẻ
  • 570 0 2

Chào mọi người, em có làm 1 project vuejs. Cho em hỏi làm trang admin như thế nào ? Đây là code hiện tại của em: app.vue

<template>
  <div id="app">
    <tour-header></tour-header>
    <router-view></router-view>
    <tour-footer style="margin-top: 60px"></tour-footer>
  </div>
</template>

<script>
export default {
  name: 'App',
  data: () => ({
    //
  }),
};
</script>

route.js

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/destination',
    name: 'Destination',
    component: Destination
  },
  {
    path: '/tour-detail',
    name: 'TourDetail',
    component: TourDetail
  },
  {
    path: '/admin/login',
    name: 'AdminLogin',
    component: AdminLogin
  },
]

nếu như trên thì khi vào /admin/login thì sẽ có header, footer của giao diện người dùng.

Cái em đang muốn là người dùng có giao diện riêng, trang admin login thì ko có header footer, còn trang admin thì giao diện riêng. Vậy phải làm sao ạ.

2 CÂU TRẢ LỜI


Đã trả lời thg 4 13, 2020 9:43 SA
+2

Vue router có trường meta e có thể dùng trường đó để xác định ai là user thường ai là admin, đồng thời ở file cấu hình vue-router e viết thêm đoạn check beforeEach, check trước khi vào 1 route xem ở meta người đó có thoả mãn là user hay admin ko thì mới cho vào ko thì redirect đến 1 trang mặc định nào đó.

Xem ở link này nhé e: https://www.digitalocean.com/community/tutorials/how-to-set-up-vue-js-authentication-and-route-handling-using-vue-router

(kéo xuống dưới 1 chút đoạn cấu hình Vue router e sẽ thấy nhé)

Chia sẻ
Avatar Minh Trí @vmtri96
thg 4 13, 2020 9:49 SA
Đã trả lời thg 5 7, 2020 3:51 SA
0

Bạn có thể xài thử thằng này: https://panjiachen.github.io/ Bạn đọc code của người ta rồi tham khảo cách viết của họ nhé. Rất bổ ích cho người mới tìm hiểu

Chia sẻ
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í