qlfy-postmate 1.1.1 → 1.1.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.
- package/README.md +98 -2
- package/lib/postMeta/ChildPostmate.d.ts +3 -3
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
#### 1、安装
|
|
4
4
|
|
|
5
5
|
```
|
|
6
|
-
npm i qlfy-postmate@1.1.
|
|
6
|
+
npm i qlfy-postmate@1.1.3
|
|
7
7
|
```
|
|
8
8
|
|
|
9
9
|
#### 2、导入
|
|
@@ -28,4 +28,100 @@ const childrenComm = new ChildPostmate({
|
|
|
28
28
|
})
|
|
29
29
|
```
|
|
30
30
|
|
|
31
|
-
|
|
31
|
+
#### 4、参数对象说明
|
|
32
|
+
|
|
33
|
+
| 回调函数名称 | 解释 | 回调参数 | 返回值 |
|
|
34
|
+
| ------------ | -------------------------------------------- | ------------------------------------------------------------ | ------ |
|
|
35
|
+
| error | 链接失败、未链接时执行 | null | void |
|
|
36
|
+
| success | 链接成功时执行 | chldPostmate | void |
|
|
37
|
+
| receive | 父页面推送数据时执行，初次链接成功会触发一次 | {<br />isHideHeader:boolean,<br />token:string,<br />loginInfo:object,<br />......<br />} | void |
|
|
38
|
+
|
|
39
|
+
#### 5、方法
|
|
40
|
+
|
|
41
|
+
| 名称 | 解释 | 使用 |
|
|
42
|
+
| ------- | ------------------------------------------------------------ | ------------------------- |
|
|
43
|
+
| getData | 链接成功后<br />可通过ChildPostmate实例对象，主动向父页面获取数据 | getData((dataInfo)=>void) |
|
|
44
|
+
|
|
45
|
+
#### 注意：
|
|
46
|
+
|
|
47
|
+
1、ChildPostmate 链接的创建是异步过程，需等待error或success函数执行后才可进行登陆状态的判断
|
|
48
|
+
|
|
49
|
+
2、getData方法，仅能在链接创建完成后再调用
|
|
50
|
+
|
|
51
|
+
3、error、success函数仅作为链接状态的标注函数，不传递数据
|
|
52
|
+
|
|
53
|
+
#### 样例：
|
|
54
|
+
|
|
55
|
+
App.vue
|
|
56
|
+
|
|
57
|
+
```vue
|
|
58
|
+
<template>
|
|
59
|
+
<div class="system-content" v-loading="loading">
|
|
60
|
+
<!-- 系统登录状态的判断，需等待postmate链接的响应后再执行 -->
|
|
61
|
+
|
|
62
|
+
<!-- 页头 -->
|
|
63
|
+
<my-header v-if="!isHideHeader"></my-header>
|
|
64
|
+
|
|
65
|
+
<!-- 侧面导航 -->
|
|
66
|
+
<my-aside v-if="!isHideHeader"></my-aside>
|
|
67
|
+
|
|
68
|
+
<!-- 内容区 -->
|
|
69
|
+
<RouterView v-if="!loading" />
|
|
70
|
+
</div>
|
|
71
|
+
</template>
|
|
72
|
+
|
|
73
|
+
<script setup lang="ts">
|
|
74
|
+
import { ref } from 'vue'
|
|
75
|
+
import { useSystemStore } from '@/store/modules/system'
|
|
76
|
+
import { ChildPostmate } from 'qlfy-postmate'
|
|
77
|
+
|
|
78
|
+
// 系统loading
|
|
79
|
+
const loading = ref(false)
|
|
80
|
+
// 页头\导航栏是否展示
|
|
81
|
+
const isHideHeader = ref(false)
|
|
82
|
+
// loading
|
|
83
|
+
const systemStore = useSystemStore()
|
|
84
|
+
|
|
85
|
+
initPostMate()
|
|
86
|
+
|
|
87
|
+
// 方法 -- 初始化postmate链接
|
|
88
|
+
function initPostMate() {
|
|
89
|
+
loading.value = true
|
|
90
|
+
const childrenComm = new ChildPostmate({
|
|
91
|
+
error: (err: any) => {
|
|
92
|
+
console.log('-----------------链接失败-----------------')
|
|
93
|
+
console.log(err)
|
|
94
|
+
loading.value = false
|
|
95
|
+
},
|
|
96
|
+
|
|
97
|
+
success: (success: any) => {
|
|
98
|
+
console.log('-----------------链接成功-----------------')
|
|
99
|
+
console.log(success)
|
|
100
|
+
loading.value = false
|
|
101
|
+
},
|
|
102
|
+
|
|
103
|
+
receive: (dataInfo: any) => {
|
|
104
|
+
console.log('-----------------接收数据-----------------')
|
|
105
|
+
console.log(dataInfo)
|
|
106
|
+
if (dataInfo.status !== 200) return
|
|
107
|
+
/**
|
|
108
|
+
* 接收到推送数据后做如下操作
|
|
109
|
+
* 1、根据isHideHeader控制页头显隐
|
|
110
|
+
* 2、将登录装填变更为已登录，并将token保存在正常登录所在位置进行取用
|
|
111
|
+
*/
|
|
112
|
+
|
|
113
|
+
// 控制导航、页头的展示
|
|
114
|
+
isHideHeader.value = dataInfo.data.isHideHeader
|
|
115
|
+
// 保存登陆信息
|
|
116
|
+
systemStore.setLoginInfo(dataInfo.data.loginInfo)
|
|
117
|
+
// 保存token
|
|
118
|
+
systemStore.setTooken(dataInfo.data.token)
|
|
119
|
+
},
|
|
120
|
+
})
|
|
121
|
+
}
|
|
122
|
+
</script>
|
|
123
|
+
|
|
124
|
+
<style scoped></style>
|
|
125
|
+
|
|
126
|
+
```
|
|
127
|
+
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
interface EventObj {
|
|
2
|
-
error: (error: any) =>
|
|
3
|
-
success: (success: any) =>
|
|
4
|
-
receive: (receive: any) =>
|
|
2
|
+
error: (error: any) => void;
|
|
3
|
+
success: (success: any) => void;
|
|
4
|
+
receive: (receive: any) => void;
|
|
5
5
|
}
|
|
6
6
|
export default class ChildPostmate {
|
|
7
7
|
childPostmate: any;
|