- page
- state.pool
- state.opened
- state.openedLoaded
- state.current
- state.keepAlive
- actions.isLoaded
- 介绍
- 参数
- 返回
- 示例
- actions.openedLoad
- 介绍
- 参数
- 返回
- 示例
- actions.opened2db
- 介绍
- 参数
- 返回
- 示例
- actions.openedUpdate
- 介绍
- 参数
- 返回
- 示例
- actions.add
- 介绍
- 参数
- 返回
- 示例
- actions.open
- 介绍
- 参数
- 返回
- 示例
- actions.close
- 介绍
- 参数
- 返回
- 示例
- actions.closeLeft
- 介绍
- 参数
- 返回
- 示例
- actions.closeRight
- 介绍
- 参数
- 返回
- 示例
- actions.closeOther
- 介绍
- 参数
- 返回
- 示例
- actions.closeAll
- 介绍
- 参数
- 返回
- 示例
- mutations.keepAliveRefresh
- 介绍
- 参数
- 示例
- mutations.keepAliveRemove
- 介绍
- 参数
- 示例
- mutations.keepAlivePush
- 介绍
- 参数
- 示例
- mutations.keepAliveClean
- 介绍
- 参数
- 示例
- mutations.currentSet
- 介绍
- 参数
- 示例
- mutations.init
- 介绍
- 参数
- 示例
作者:管理员 历史版本:1 更新时间:2024-11-20 15:41
page
state.pool
可以在多页 tab 模式下显示的页面
state.opened
当前显示的多页面列表
state.openedLoaded
标记已经加载多标签页数据。
state.current
当前页面
state.keepAlive
需要缓存的页面 name 数组
actions.isLoaded
介绍
确认已经加载多标签页数据。
参数
无
返回
promise
示例
(async function () {
// 这里不一定已经加载完成多标签页数据
await this.$store.dispatch('ibps/page/isLoaded')
// 在这里确保已经加载完成多标签页数据
})()
使用情景参考 commit
actions.openedLoad
介绍
从持久化数据载入分页列表。
参数
无
返回
promise
示例
this.$store.dispatch('ibps/page/openedLoad')
actions.opened2db
介绍
将 opened 属性赋值并持久化。
::: tip
在这之前请先确保已经更新了 state.opened。
:::
参数
无
返回
promise
示例
this.$store.dispatch('ibps/page/opened2db')
actions.openedUpdate
介绍
更新页面列表上的某一项。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
index | 已经打开的页面的位置 | 必选 | Number | ||
params | route params | 非 | Object | ||
query | route query | 非 | Object |
返回
promise
示例
this.$store.dispatch('ibps/page/openedUpdate', {
index: 2,
params: {
name: 'new-name'
},
query: {
value: 'new-value'
}
})
actions.add
介绍
新增一个 tag。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
tag | { name, path, meta } | state.pool 中的某项 | Object | ||
params | route params | 非 | Object | ||
query | route query | 非 | Object |
返回
promise
示例
this.$store.dispatch('ibps/page/add', {
tag: {
name: 'route-name',
path: 'route-path',
meta: {}
},
params: {},
query: {}
})
actions.open
介绍
打开一个新的页面。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
name | route name | 必选 | String | ||
params | route params | 非 | Object | ||
query | route query | 非 | Object |
返回
promise
示例
router.afterEach(to => {
// 需要的信息
const app = router.app
const { name, params, query } = to
// 多页控制 打开新的页面
app.$store.dispatch('ibps/page/open', { name, params, query })
})
actions.close
介绍
关闭一个 tag。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
pageSelect | 要关闭的标签名字 | 选填 | String |
返回
promise
示例
this.$store.dispatch('ibps/page/close', {
pageSelect: 'route-name'
})
—–关闭当前。可以传空
this.$store.dispatch('ibps/page/close', {})
actions.closeLeft
介绍
关闭当前标签左边的标签。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
pageSelect | 当前选中的 tagName | 必选 | String |
返回
promise
示例
this.$store.dispatch('ibps/page/closeLeft', {
pageSelect: 'route-name'
})
actions.closeRight
介绍
关闭当前标签右边的标签。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
pageSelect | 当前选中的 tagName | 必选 | String |
返回
promise
示例
this.$store.dispatch('ibps/page/closeRight', {
pageSelect: 'route-name'
})
actions.closeOther
介绍
关闭当前激活之外的标签。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
pageSelect | 当前选中的 tagName | 必选 | String |
返回
promise
示例
this.$store.dispatch('ibps/page/closeOther', {
pageSelect: 'route-name'
})
actions.closeAll
介绍
关闭所有标签。
参数
无
返回
promise
示例
this.$store.dispatch('ibps/page/closeAll')
mutations.keepAliveRefresh
介绍
从已经打开的页面记录中更新需要缓存的页面记录。
参数
无
示例
this.$store.commit('ibps/page/keepAliveRefresh')
mutations.keepAliveRemove
介绍
删除一个页面的缓存设置。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
name | route name | 必选 | String |
示例
this.$store.commit('ibps/page/keepAliveRemove', 'page-name')
mutations.keepAlivePush
介绍
增加一个页面的缓存设置。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
name | route name | 必选 | String |
示例
this.$store.commit('ibps/page/keepAlivePush', 'page-name')
mutations.keepAliveClean
介绍
清空页面缓存设置。
参数
无
示例
this.$store.commit('ibps/page/keepAliveClean')
mutations.currentSet
介绍
设置当前激活的页面 name。
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
name | route name | 必选 | String |
示例
this.$store.commit('ibps/page/currentSet', 'route-name')
mutations.init
介绍
初始化多页面功能,将路由设置转化为 store 中的预备数据
参数
参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
---|---|---|---|---|---|
routes | 路由设置 | 必选 | Array |
示例
import { frameInRoutes } from '@/router/routes'
this.$store.commit('ibps/page/init', frameInRoutes)