index.vue 1.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <template>
  2. <div>
  3. <div v-for="item in list" :key="item.path">
  4. <template v-if="!item.hidden">
  5. <template v-if="!item.children || !item.children.length" style="display: block">
  6. <el-link class="title" :underline="false" @click="clickMenu(item.path)">{{ item.meta.title }}</el-link>
  7. </template>
  8. <template v-else>
  9. <h5 class="title">{{ item.meta.title }}</h5>
  10. <MenuRouter :list="item.children" class="menu"/>
  11. </template>
  12. </template>
  13. </div>
  14. </div>
  15. </template>
  16. <script>
  17. export default {
  18. name: 'MenuRouter',
  19. props: {
  20. list: {
  21. type: Array,
  22. default: () => []
  23. }
  24. },
  25. methods: {
  26. // 点击菜单
  27. clickMenu(path) {
  28. const curlArr = ['/notice', '/issue']
  29. // if (curlArr.includes(path)) {
  30. // path += '/index'
  31. // }
  32. this.$router.push({
  33. path
  34. })
  35. }
  36. }
  37. }
  38. </script>
  39. <style lang="scss" scoped>
  40. .menu {
  41. display: flex;
  42. flex-direction: row;
  43. flex-wrap: wrap;
  44. }
  45. .title {
  46. padding: 3px 10px;
  47. margin-top: 16px;
  48. }
  49. </style>