Ant Design Pro of Vue 修改侧栏菜单宽度的正确姿势

最新推荐文章于 2023-05-16 11:27:14 发布

西涯三锋

最新推荐文章于 2023-05-16 11:27:14 发布

阅读量2.2k

点赞数 5

分类专栏：前端实践文章标签： vue antdv

本文链接：https://blog.csdn.net/assokoo123/article/details/126629075

版权

前端实践专栏收录该内容

15 篇文章 0 订阅

订阅专栏

只需要在 `src/layouts/BasicLayout.vue` 给 `pro-layout`组件增加一个属性 `siderWidth` 即可，通过阅读源码，这个属性就是用来设置侧栏宽度的，它的值设置为一个数值即可，比如 200 或 220。

下面附上代码片段

<!-- file: src/layouts/BasicLayout.vue -->

<template>
	<pro-layout
		:menus="menus"
		:collapsed="collapsed"
		:mediaQuery="query"
		:isMobile="isMobile"
		:handleMediaQuery="handleMediaQuery"
		:handleCollapse="handleCollapse"
		:i18nRender="i18nRender"
		:siderWidth="200"
		v-bind="settings"
	>
    // ……其他代码

附实测代码截图

Ant Design Pro of Vue 修改侧栏菜单宽度设置图片教程