Implementing a horizontal multi-level navigation menu

[zhongjiaguo001]

What happened?

In the documentation, the BtnDropdown component example demonstrates a three-level menu, but it does not meet my expectations. I want to display submenus by hovering and need it to be a recursive component, as the data is in a tree structure. Currently, I am unsure of how to implement these features. If you could provide any suggestions or examples, I would greatly appreciate it. Thank you for taking the time to help.

What did you expect to happen?

Capability to implement a recursive, horizontal, multi-level menu component that displays submenus upon hovering.

Reproduction URL

none

How to reproduce?

https://jsfiddle.net/ph822720355/4dbfqLjc/ this a copy demo

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Components (quasar)

Platforms/Browsers

Chrome

Quasar info output

No response

Relevant log output

No response

Additional context

No response

[github-actions[bot]]

Hi @zhongjiaguo001! 👋

It looks like you provided an invalid or unsupported reproduction URL.
Do not use any service other than Codepen, jsFiddle, StackBlitz, Codesandbox, and GitHub.
Make sure the URL you provided is correct and reachable. You can test it by visiting it in a private tab, another device, etc.
Please edit your original post above and provide a valid reproduction URL as explained.

Without a proper reproduction, your issue will have to get closed.

Thank you for your collaboration. 👏

[dimau]

Actually I have the same question, just started to use Quasar Framework and found that this topic is not obvious

[ivan006]

the BtnDropdown component example demonstrates a three-level menu, but it does not meet my expectations. I want to display submenus by hovering and need it to be a recursive component, as the data is in a tree structure. Currently, I am unsure of how to implement these features. If you could provide any suggestions or examples, I

great example thanks for the code <3