Skip to content

Commit

Permalink
fix: 修复Unite组件逻辑
Browse files Browse the repository at this point in the history
  • Loading branch information
三少 committed Apr 22, 2022
1 parent cef869e commit 658082a
Show file tree
Hide file tree
Showing 5 changed files with 109 additions and 91 deletions.
4 changes: 2 additions & 2 deletions packages/vantui/src/unite-context/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ export const UniteContext = createContext({
page: false,
},
onRefresh: () => {
return Promise.resolve()
return Promise.resolve({ code: '200', message: '请求成功', data: null })
},
error: undefined,
setError: (value: any) => {
Expand All @@ -15,7 +15,7 @@ export const UniteContext = createContext({
uniteConfig: {
page?: boolean
}
onRefresh: () => Promise<void>
onRefresh: () => Promise<{ code: string; message: string; data: any }>
error?: { code: string; message: string; data: any }
setError: React.Dispatch<
React.SetStateAction<
Expand Down
11 changes: 0 additions & 11 deletions packages/vantui/src/unite/index.less

This file was deleted.

179 changes: 103 additions & 76 deletions packages/vantui/src/unite/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,10 @@ import {
useReady,
useRouter,
} from '@tarojs/taro'
import { View } from '@tarojs/components'
import { UniteContext } from '../unite-context'
import { parse } from '../utils'

function useContainer(config: any, props: any) {
function useContainer(config: any, props: any, options: any) {
// 兼容react-refresh
const cfgRef = useRef({}) as React.MutableRefObject<any>
cfgRef.current = config
Expand All @@ -29,6 +28,7 @@ function useContainer(config: any, props: any) {

// 通过ref定义一些开关
const flagRef = useRef({
__refresh: false,
__mounted: false,
__init: false,
__refactor: function () {
Expand Down Expand Up @@ -63,8 +63,10 @@ function useContainer(config: any, props: any) {
const _defined = function (this: any, ...args: any[]): any {
let res: any
try {
if (insRef.current.loading[item]) {
return new Promise(() => {})
if (!options?.cancelInterception?.[item]) {
if (insRef.current.loading[item]) {
return new Promise(() => {})
}
}
res = copyFunc!.call(this, ...args)
if (typeof res?.then !== 'function') {
Expand All @@ -76,7 +78,7 @@ function useContainer(config: any, props: any) {
const loadingFalse = {
[item]: false,
} as any
return new Promise(function (resolve) {
return new Promise(function (resolve, reject) {
insRef.current.loading[item] = true
_setLoading(loadingTrue)
res
Expand All @@ -88,19 +90,45 @@ function useContainer(config: any, props: any) {
.catch(function (err: any) {
insRef.current.loading[item] = false
_setLoading(loadingFalse)
setError({
code: err.code || 'JSError',
message: err.message || '语法出现了小故障',
data: err.data || err,
})
if (
flagRef.current.__refresh &&
(item === 'onLoad' ||
item === 'onReady' ||
item === 'onShow')
) {
flagRef.current.__refresh = false
reject({
code: err.code || 'JSError',
message: err.message || '语法出现了小故障',
data: err.data || err,
})
} else {
setError({
code: err.code || 'JSError',
message: err.message || '语法出现了小故障',
data: err.data || err,
})
}
})
})
} catch (err) {
setError({
code: 'JSError',
message: '语法出现了小故障',
data: err,
})
if (
flagRef.current.__refresh &&
(item === 'onLoad' || item === 'onReady' || item === 'onShow')
) {
flagRef.current.__refresh = false
throw {
code: 'JSError',
message: '语法出现了小故障',
data: err,
}
} else {
setError({
code: 'JSError',
message: '语法出现了小故障',
data: err,
})
}
}
}
insRef.current[item] = _defined.bind(insRef.current)
Expand All @@ -109,72 +137,73 @@ function useContainer(config: any, props: any) {
}
}
insRef.current.onRefresh = function () {
flagRef.current.__refresh = true
return new Promise((resolve: (value?: any) => void) => {
let isPromise = false
let asyncFuncCount = 0
let execAsyncFuncCount = 0
if (typeof insRef.current?.onLoad === 'function') {
const res = insRef.current?.onLoad()
if (res.then) {
isPromise = true
asyncFuncCount++
res
.then(() => {
execAsyncFuncCount++
if (execAsyncFuncCount === asyncFuncCount) {
resolve()
}
})
.catch(() => {
execAsyncFuncCount++
if (execAsyncFuncCount === asyncFuncCount) {
resolve()
}
})
try {
if (typeof insRef.current?.onLoad === 'function') {
const res = insRef.current.onLoad()
if (res.then) {
isPromise = true
asyncFuncCount++
res
.then((data: any) => {
execAsyncFuncCount++
if (execAsyncFuncCount === asyncFuncCount) {
resolve({ code: '200', message: '请求成功', data: data })
}
})
.catch((e: any) => {
resolve({ code: e.code, message: e.message, data: e.data })
})
}
}
}
if (typeof insRef.current?.onReady === 'function') {
const res = insRef.current?.onReady()
if (res.then) {
isPromise = true
asyncFuncCount++
res
.then(() => {
execAsyncFuncCount++
if (execAsyncFuncCount === asyncFuncCount) {
resolve()
}
})
.catch(() => {
execAsyncFuncCount++
if (execAsyncFuncCount === asyncFuncCount) {
resolve()
}
})
if (typeof insRef.current?.onReady === 'function') {
const res = insRef.current.onReady()
if (res.then) {
isPromise = true
asyncFuncCount++
res
.then((data: any) => {
execAsyncFuncCount++
if (execAsyncFuncCount === asyncFuncCount) {
resolve({ code: '200', message: '请求成功', data: data })
}
})
.catch((e: any) => {
resolve({ code: e.code, message: e.message, data: e.data })
})
}
}
}
if (typeof insRef.current?.onShow === 'function') {
const res = insRef.current?.onShow()
if (res.then) {
isPromise = true
asyncFuncCount++
res
.then(() => {
execAsyncFuncCount++
if (execAsyncFuncCount === asyncFuncCount) {
resolve()
}
})
.catch(() => {
execAsyncFuncCount++
if (execAsyncFuncCount === asyncFuncCount) {
resolve()
}
})
if (typeof insRef.current?.onShow === 'function') {
const res = insRef.current.onShow()
if (res.then) {
isPromise = true
asyncFuncCount++
res
.then((data: any) => {
execAsyncFuncCount++
if (execAsyncFuncCount === asyncFuncCount) {
resolve({ code: '200', message: '请求成功', data: data })
}
})
.catch((e: any) => {
resolve({ code: e.code, message: e.message, data: e.data })
})
}
}
} catch (error: any) {
resolve({
code: error.code || 'JSError',
message: error.message || '语法出现了小故障',
data: error.data,
})
}
if (!isPromise) {
resolve()
flagRef.current.__refresh = false
resolve({ code: '200', message: '请求成功', data: null })
}
})
}
Expand Down Expand Up @@ -252,7 +281,7 @@ function HackComponent(props: any) {
export function Unite(config: any, render: any, options: any = {}) {
// 返回函数式组件
return function Index(props: any) {
const { renderData, onRefresh } = useContainer(config, props)
const { renderData, onRefresh } = useContainer(config, props, options)

// 执行业务侧函数式组件
return (
Expand All @@ -264,9 +293,7 @@ export function Unite(config: any, render: any, options: any = {}) {
onRefresh: onRefresh,
}}
>
<View className={options.page ? 'antmjs-vantui-unite' : ''}>
<HackComponent data={renderData} render={render} prevProps={props} />
</View>
<HackComponent data={renderData} render={render} prevProps={props} />
</UniteContext.Provider>
)
}
Expand Down
2 changes: 1 addition & 1 deletion packages/vantui/types/unite-context.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ declare const UniteContext: React.Context<{
uniteConfig: {
page?: boolean
}
onRefresh: () => Promise<void>
onRefresh: () => Promise<{ code: string; message: string; data: any }>
error?: { code: string; message: string; data: any }
setError: React.Dispatch<
React.SetStateAction<
Expand Down
4 changes: 3 additions & 1 deletion packages/vantui/types/unite.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ declare namespace Unite {
state: Partial<StateOpt<TState>> | React.SetStateAction<StateOpt<TState>>,
) => void
setError: React.Dispatch<React.SetStateAction<IError | undefined>>
onRefresh: () => void
onRefresh: () => Promise<{ code: string; message: string; data: any }>
setHooks: (hooks: IAnyObject) => void
}
interface InstanceProperty<
Expand Down Expand Up @@ -122,6 +122,8 @@ declare function Unite<
render: (data: Unite.Response<TState, TAll>, props: TProps) => JSX.Element,
options?: {
page?: boolean
cancelInterception?: Unite.FunctionProperties<TAll> &
Unite.InstanceMethods<TState>
},
): (props: TProps) => any

Expand Down

0 comments on commit 658082a

Please sign in to comment.