vueComponent / pro-components

easy use `Ant Design Vue` layout
MIT License
535 stars 214 forks source link

[BUG] PageContainer 的 tab-list 样式不对 #192

Closed cTaoLee closed 2 years ago

cTaoLee commented 2 years ago

🐛 Bug 描述 Bug description

如题,数据是有出来的,tabChange 也有触发,但是样式错误,没有找到相关使用例子 应该是和 #186 是同个问题

🏞 期望结果 Desired result

修复样式,或提供正确使用例子

🚑 其他信息 Other information

1641633044(1) 版本:vue3 + ant-design-vue: 3.0.0-alpha.15 + @ant-design-vue/pro-layout: 3.1.12 复现代码:

<template>
  <page-container
    :tab-list="tabList"
    :tab-active-key="tabActiveKey"
    :tab-change="(key) => {
      tabActiveKey = key
    }"
    content="段落示意:蚂蚁金服务设计平台 ant.design,用最小的工作量,无缝接入蚂蚁金服生态, 提供跨越设计与开发的体验解决方案。"
  >

  </page-container>
</template>
<script lang="ts">
import { defineComponent, reactive, ref, watch } from 'vue';

export default defineComponent({
  setup() {

    const tabActiveKey= ref('tab1')
    const tabList = [
      { key: 'tab1', tab: '快速开始' },
      { key: 'tab2', tab: '产品简介' },
      { key: 'tab3', tab: '产品文档' }
    ]
    return {
      tabList,
      tabActiveKey
    };
  },
});
</script>
sendya commented 2 years ago

本项目还不支持 ant-desig-vue@3x 目前支持 ant-design-vue@2.x

不要在标定版本以外使用,有问题无法处理!

image

andrewgreat commented 2 years ago

这个是pro-layout与ant-design-vue兼容性问题,升级ant-design-vue到最新版本3.0.0-beta.7可以解决