iframe-tab-sdk 1.0.2 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +5 -5
  2. package/index.js +30 -15
  3. package/package.json +3 -3
package/README.md CHANGED
@@ -5,12 +5,12 @@ iframe微前端集成, 顶部tab页操作;支持独立运行
5
5
  ## API
6
6
  |方法名|说明|参数|类型
7
7
  |:----|:----|:----|:----
8
- |openTab|打开tab页|urlPath,openRoute|string,object
9
- |refreshTab|刷新tab页|urlPath,openRoute|string,object
8
+ |openTab|打开tab页|[openRoute](#openroute-attributes),详见下表|object
9
+ |refreshTab|刷新tab页|[openRoute](#openroute-attributes)|object
10
10
  |closeTab|关闭tab页|urlPath|string
11
11
  |logout|退出登录|无|无
12
12
  |reload|刷新主应用网页|无|无
13
- |closeAndOpenTab|关闭当前tab并新开tab|urlPath,{ {...openRoute}, closeTabName }|string,object
13
+ |closeAndOpenTab|关闭当前tab并新开tab|{ [openRoute](#openroute-attributes), closeTabName,message }|object
14
14
  |fullscreen|全屏/退出全屏|isFullScreen|boolean
15
15
 
16
16
  ### openRoute Attributes
@@ -27,7 +27,7 @@ iframe微前端集成, 顶部tab页操作;支持独立运行
27
27
  ## 示例(vue+elementui)
28
28
  ``` vue
29
29
  <template>
30
- <el-button type="primary" @click="closeAndOpenTab(urlPath,{...openRoute,closeTabName: '/console/user/add',message:'用户添加成功!' })">关闭当前tab并打开新的tab页</el-button>
30
+ <el-button type="primary" @click="closeAndOpenTab({openRoute,closeTabName: '/console/user/add',message:'用户添加成功!' })">关闭当前tab并打开新的tab页</el-button>
31
31
  </template>
32
32
  <script>
33
33
  import {closeAndOpenTabAsIframe} from 'iframe-tab-sdk'
@@ -48,4 +48,4 @@ export default {
48
48
  }
49
49
  </script>
50
50
 
51
- ```
51
+ ```
package/index.js CHANGED
@@ -64,25 +64,32 @@ function navigateTo(urlPath, query = {}) {
64
64
 
65
65
  /**
66
66
  * 新开或跳转 tab 标签页
67
+ * @param {String} urlPath 页面地址
67
68
  * @param {Object} params 相关参数
68
- * @param {String} params[urlPath] 页面地址
69
69
  * @param {String} params[name] 页面名称
70
70
  * @param {String} params[title] 页面标题
71
71
  * @param {Object} params[query] query 参数
72
- * @param {Boolean} params[refreshClearQuery] 是否清空路由参数
73
72
  *
74
73
  */
75
- export function openTab(params) {
74
+ export function openTab(urlPath, params) {
75
+ const { name, title, query = {} } = params;
76
+
76
77
  if (window.isIframeRun) {
77
78
  window.parent.postMessage(
78
79
  {
79
80
  type: "openTab",
80
- params
81
+ params: {
82
+ ...params,
83
+ urlPath, // 页面地址
84
+ name: name ?? title, // 页面名称
85
+ title: title ?? name, // 页面标题
86
+ // 目标页面 tab 已存在时,query 参数变更会自动刷新目标页面
87
+ query,
88
+ },
81
89
  },
82
90
  origin
83
91
  );
84
92
  } else {
85
- const { urlPath, query = {} } = params;
86
93
  // 非iframe环境,执行路由跳转
87
94
  navigateTo(urlPath, query);
88
95
  }
@@ -90,24 +97,22 @@ export function openTab(params) {
90
97
 
91
98
  /**
92
99
  * 刷新指定 tab 标签页
100
+ * @param {String} urlPath 指定 tab 标签页 URL
93
101
  * @param {Object} params 相关参数
94
- * @param {String} params[urlPath] 指定 tab 标签页 URL
95
102
  * @param {String} params[name] 页面名称
96
103
  * @param {String} params[title] 页面标题
97
104
  * @param {Object} params[query] query 参数
98
105
  */
99
- export function refreshTab(params) {
100
- const urlPath = params.urlPath;
106
+ export function refreshTab(urlPath, params) {
101
107
  if (window.isIframeRun) {
102
108
  if (params) {
103
- return openTab(params);
109
+ return openTab(urlPath, params);
104
110
  }
105
-
106
111
  window.parent.postMessage({ type: "refreshTab", params: urlPath }, origin);
107
112
  } else {
108
113
  // 非iframe环境下,重新导航到指定路径
109
114
  if (params) {
110
- return openTab(params);
115
+ return openTab(urlPath, params);
111
116
  }
112
117
  navigateTo(urlPath, {});
113
118
  }
@@ -138,7 +143,7 @@ export function logout() {
138
143
  window.parent.postMessage({ type: "logout" }, origin);
139
144
  } else {
140
145
  // 非iframe环境,直接执行登出逻辑
141
- window.location.href = '/';
146
+ window.location.href = '/logout';
142
147
  }
143
148
  }
144
149
 
@@ -157,17 +162,27 @@ export function reload() {
157
162
  /**
158
163
  * 关闭某个tab打开新的tab(常用于关闭自身tab并打开新tab)
159
164
  */
160
- export function closeAndOpenTab(params) {
165
+ export function closeAndOpenTab(urlPath, params) {
166
+ const { name, title, query = {}, closeTabName } = params;
167
+
161
168
  if (window.isIframeRun) {
162
169
  window.parent.postMessage(
163
170
  {
164
171
  type: "closeAndOpenTab",
165
- params
172
+ params: {
173
+ closeTabName,
174
+ openRoute: {
175
+ urlPath, // 页面地址
176
+ name: name ?? title, // 页面名称
177
+ title: title ?? name, // 页面标题
178
+ // 目标页面 tab 已存在时,query 参数变更会自动刷新目标页面
179
+ query,
180
+ },
181
+ },
166
182
  },
167
183
  origin
168
184
  );
169
185
  } else {
170
- const {urlPath,query} = params;
171
186
  // 非iframe环境,直接跳转到新页面
172
187
  navigateTo(urlPath, query);
173
188
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "iframe-tab-sdk",
3
- "version": "1.0.2",
3
+ "version": "1.0.3",
4
4
  "description": "门户iframe集成子应用顶部tab页管理",
5
5
  "main": "index.js",
6
6
  "private": false,
@@ -10,5 +10,5 @@
10
10
  },
11
11
  "keywords": ["iframe", "tab", "集成", "微前端"],
12
12
  "author": "wy",
13
- "license": "ISC"
14
- }
13
+ "license": "MIT"
14
+ }