diff --git a/apps/web-antd/src/layouts/basic.vue b/apps/web-antd/src/layouts/basic.vue index 07b684c7..49641fd1 100644 --- a/apps/web-antd/src/layouts/basic.vue +++ b/apps/web-antd/src/layouts/basic.vue @@ -116,7 +116,7 @@ watch( async (enable) => { if (enable) { await updateWatermark({ - content: `${userStore.userInfo?.username}`, + content: `${userStore.userInfo?.username} - ${userStore.userInfo?.realName}`, }); } else { destroyWatermark(); diff --git a/docs/src/components/common-ui/vben-api-component.md b/docs/src/components/common-ui/vben-api-component.md index caa9facf..dac916bf 100644 --- a/docs/src/components/common-ui/vben-api-component.md +++ b/docs/src/components/common-ui/vben-api-component.md @@ -123,6 +123,10 @@ function fetchApi(): Promise> { ::: +## 并发和缓存 + +有些场景下可能需要使用多个ApiComponent,它们使用了相同的远程数据源(例如用在可编辑的表格中)。如果直接将请求后端接口的函数传递给api属性,则每一个实例都会访问一次接口,这会造成资源浪费,是完全没有必要的。Tanstack Query提供了并发控制、缓存、重试等诸多特性,我们可以将接口请求函数用useQuery包装一下再传递给ApiComponent,这样的话无论页面有多少个使用相同数据源的ApiComponent实例,都只会发起一次远程请求。演示效果请参考 [Playground vue-query](https://www.vben.pro/#/demos/features/vue-query),具体代码请查看项目文件[concurrency-caching](https://github.com/vbenjs/vue-vben-admin/blob/main/playground/src/views/demos/features/vue-query/concurrency-caching.vue) + ## API ### Props @@ -147,3 +151,10 @@ function fetchApi(): Promise> { | options | 直接传入选项数据,也作为api返回空数据时的后备数据 | `OptionsItem[]` | - | | visibleEvent | 触发重新请求数据的事件名 | `string` | - | | loadingSlot | 目标组件的插槽名称,用来显示一个"加载中"的图标 | `string` | - | + +### Methods + +| 方法 | 描述 | 类型 | 版本要求 | +| --- | --- | --- | --- | +| getComponentRef | 获取被包装的组件的实例 | ()=>T | >5.5.4 | +| updateParam | 设置接口请求参数(将与params属性合并) | (newParams: Record)=>void | >5.5.4 | diff --git a/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap b/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap index d537d22e..17f8dc58 100644 --- a/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap +++ b/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap @@ -68,10 +68,12 @@ exports[`defaultPreferences immutability test > should not modify the config obj "sidebar": { "autoActivateChild": false, "collapsed": false, + "collapsedButton": true, "collapsedShowTitle": false, "enable": true, "expandOnHover": true, "extraCollapse": false, + "fixedButton": true, "hidden": false, "width": 224, }, diff --git a/packages/@core/preferences/src/config.ts b/packages/@core/preferences/src/config.ts index 27932910..7f788d50 100644 --- a/packages/@core/preferences/src/config.ts +++ b/packages/@core/preferences/src/config.ts @@ -68,10 +68,12 @@ const defaultPreferences: Preferences = { sidebar: { autoActivateChild: false, collapsed: false, + collapsedButton: true, collapsedShowTitle: false, enable: true, expandOnHover: true, extraCollapse: false, + fixedButton: true, hidden: false, width: 224, }, diff --git a/packages/@core/preferences/src/types.ts b/packages/@core/preferences/src/types.ts index 9c7e87bc..babdaef0 100644 --- a/packages/@core/preferences/src/types.ts +++ b/packages/@core/preferences/src/types.ts @@ -132,6 +132,8 @@ interface SidebarPreferences { autoActivateChild: boolean; /** 侧边栏是否折叠 */ collapsed: boolean; + /** 侧边栏折叠按钮是否可见 */ + collapsedButton: boolean; /** 侧边栏折叠时,是否显示title */ collapsedShowTitle: boolean; /** 侧边栏是否可见 */ @@ -140,6 +142,8 @@ interface SidebarPreferences { expandOnHover: boolean; /** 侧边栏扩展区域是否折叠 */ extraCollapse: boolean; + /** 侧边栏固定按钮是否可见 */ + fixedButton: boolean; /** 侧边栏是否隐藏 - css */ hidden: boolean; /** 侧边栏宽度 */ diff --git a/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue b/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue index 722d2ea6..214658d3 100644 --- a/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue +++ b/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue @@ -1,10 +1,12 @@