Skip to content

[Question] Help 面包屑不显示(插槽内容直接就没渲染) 还有侧边栏的主题色也不改变 #279

Open
@sharebravery

Description

@sharebravery

🧐 问题描述 Problem Description

面包屑不显示(插槽内容直接就没渲染) 还有侧边栏的主题色也不改变 尝试了多种方式修改后还是不行 令我十分困惑

"@ant-design-vue/pro-layout": "^3.2.3"
"ant-design-vue": "3.2.15"

💻 示例代码 Sample code

<script setup lang="ts">
import '@ant-design-vue/pro-layout/dist/style.css';
import ProLayout, { PageContainer, clearMenuItem, getMenuData } from '@ant-design-vue/pro-layout';
import { computed, reactive } from 'vue';
import { useRouter } from 'vue-router';
import RightContent from './components/RightContent.vue';

const router = useRouter();

const { menuData } = getMenuData(clearMenuItem(router.getRoutes()));

const breadcrumb = computed(() =>
  router.currentRoute.value.matched.concat().map(item => {
    return {
      path: item.path,
      breadcrumbName: item.meta.title || '555',
    };
  })
);

const state = reactive({
  collapsed: false, // default value
  openKeys: [''],
  selectedKeys: [''],
});

// Config : https://preview.pro.antdv.com/dashboard/workplace
const layoutConf = reactive({
  layout: 'sidemenu',
  contentWidth: 'Fluid',
  theme: 'light',
  primaryColor: '#1890ff',
  fixedHeader: true,
  fixSiderbar: true,
  hideHintAlert: false,
  hideCopyButton: false,

  title: import.meta.env.VITE_APP_TITLE,
  logo: null,
  menuData,
});
</script>

<template>
  <pro-layout
    v-bind="layoutConf"
    v-model:collapsed="state.collapsed"
    v-model:openKeys="state.openKeys"
    v-model:selectedKeys="state.selectedKeys"
    :breadcrumb="{ routes: breadcrumb }"
  >
    {{ breadcrumb }}
    <template #rightContentRender>
      <RightContent />
    </template>

    <RouterView v-slot="{ Component, route }">
      <transition name="slide-left" mode="out-in">
        <component :is="Component" :key="route.path" />
      </transition>
    </RouterView>
  </pro-layout>
</template>

🚑 其他信息 Other information

menuData:
image

页面:
image

Metadata

Metadata

Assignees

No one assigned

    Labels

    questionFurther information is requested

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions