Asked Dec 1st, 2021 3:34 p.m. 284 2 1
  • 284 2 1
0

Menu đa cấp

Share
  • 284 2 1

XIn chào mọi người em đang thực hiện làm menu đa cấp . Nhưng hiện tại em đang bí vì không biết làm sao lấy đc cái menu con từ menu cha .Vd như -Áo --- Áo phông ---Áo khoác -Quần -Phụ kiện Em có tham khảo qua cách làm PHP nhưng em muốn xử lý nó bên Nodejs với Reactjs. Mọi người có thể chỉ em cách làm đc không ạ? đây là database em thiết kế và em muốn làm cái menu theo database này ạ

1 ANSWERS


Answered Dec 2nd, 2021 2:04 a.m.
Accepted
+1

Bạn có thể tham khảo cách của mình:

// 1. Tổ chức bảng từ DB thành cấu trúc mảng tương đương
const categories = [
  {
    id: 1,
    name: "Áo",
    slug: "",
    parent: 0
  },
  {
    id: 2,
    name: "Quần",
    slug: "",
    parent: 0
  },
  {
    id: 3,
    name: "Giày dép",
    slug: "",
    parent: 0
  },
  {
    id: 4,
    name: "Phụ kiện",
    slug: "",
    parent: 0
  },
  {
    id: 5,
    name: "Áo phông",
    slug: "",
    parent: 1
  },
  {
    id: 6,
    name: "Áo len",
    slug: "",
    parent: 1
  },
  {
    id: 7,
    name: "Quần Jean",
    slug: "",
    parent: 2
  }
];

// 2. Lọc những category không có parent thành menu cấp cao nhất
const menu = categories.filter(category => !category.parent);

// 3. Trong từng cấp menu, lọc ra những menu con có "parent" trùng với "id" của menu cha
menu.forEach(category => {
  category.children = categories.filter(c => c.parent === category.id);
});

// Cuối cùng là render cấu trúc menu bằng React thôi :)
Share
Avatar Ha Tran @longtrancc
Dec 2nd, 2021 2:22 a.m.

Ôi cảm ơn bạn nhiều đúng cái mình cần 😘😘😘

0
| Reply
Share
Avatar ttdat @ttdat-thecodeguy
Dec 6th, 2021 3:12 a.m.

tui cũng đang thắc mắc cái này

0
| Reply
Share
Viblo
Let's register a Viblo Account to get more interesting posts.