fix(react): fix formSpy conflict with parent SchemaForm (#854)

alibaba · May 18, 2020 · e122c9d · e122c9d
1 parent 7be5b3e
commit e122c9d
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 85 deletions.
diff --git a/docs/zh-cn/jsx-develop/faq.md b/docs/zh-cn/jsx-develop/faq.md
@@ -1,79 +0,0 @@
-# FAQ
-
-```jsx
-import React, { useEffect, useState } from 'react'
-import ReactDOM from 'react-dom'
-import { SchemaForm } from '@formily/antd' // 或者 @formily/next
-import { Input, Select, Radio } from '@formily/antd-components'
-import Printer from '@formily/printer'
-import 'antd/dist/antd.css'
-
-const mockSchema = {
-  type: 'object',
-  properties: {
-    aa: {
-      type: 'boolean',
-      enum: [
-        { label: '设置bb的枚举列表', value: true },
-        { label: '还原bb的枚举列表', value: false }
-      ],
-      default: false,
-      title: 'AA',
-      'x-component': 'RadioGroup',
-      'x-linkages': [
-        {
-          type: 'value:schema',
-          target: 'bb',
-          condition: '{{!!$value}}',
-          schema: {
-            enum: ['xx1', 'xx2', 'xx3']
-          },
-          otherwise: {
-            enum: ['zz']
-          }
-        }
-      ]
-    },
-    bb: {
-      type: 'string',
-      title: 'BB',
-      'x-component': 'Input',
-      enum: ['yy']
-    },
-    cc: {
-      type: 'string',
-      title: '{{customCCTitle}}',
-      'x-component': 'Input'
-    }
-  }
-}
-
-const App = () => {
-  const [schema, setSchema] = useState({
-    type: 'object'
-  })
-  useEffect(() => {
-    setTimeout(() => {
-      setSchema(mockSchema)
-    }, 1000)
-  }, [])
-
-  return (
-    <Printer>
-      <SchemaForm
-        schema={schema}
-        components={{ Input, Select, RadioGroup: Radio.Group }}
-        onSubmit={values => {
-          console.log(values)
-        }}
-        expressionScope={{
-          customTitle: 'this is custom title',
-          customCCTitle: 'CC'
-        }}
-      />
-    </Printer>
-  )
-}
-
-ReactDOM.render(<App />, document.getElementById('root'))
-```

diff --git a/packages/react/src/hooks/useFormSpy.ts b/packages/react/src/hooks/useFormSpy.ts
@@ -8,7 +8,7 @@ import {
   useReducer
 } from 'react'
 import { FormHeartSubscriber, LifeCycleTypes, IForm } from '@formily/core'
-import { isStr, FormPath, isArr,isFn } from '@formily/shared'
+import { isStr, FormPath, isArr, isFn } from '@formily/shared'
 import { IFormSpyProps, ISpyHook } from '../types'
 import FormContext, { BroadcastContext } from '../context'
 
@@ -67,10 +67,10 @@ export const useFormSpy = (props: IFormSpyProps): ISpyHook => {
   }, [])
   useMemo(() => {
     initializedRef.current = true
-    if (form) {
-      subscriberId.current = form.subscribe(subscriber)
-    } else if (broadcast) {
+    if (broadcast) {
       subscriberId.current = broadcast.subscribe(subscriber)
+    } else if (form) {
+      subscriberId.current = form.subscribe(subscriber)
     }
     initializedRef.current = false
   }, [])
@@ -84,7 +84,7 @@ export const useFormSpy = (props: IFormSpyProps): ISpyHook => {
       unmountRef.current = true
     }
   }, [])
-  const formApi: IForm = form ? form : broadcast && broadcast.getContext()
+  const formApi: IForm = broadcast ? broadcast && broadcast.getContext() : form
   return {
     form: formApi,
     type,

diff --git a/packages/react/src/shared.ts b/packages/react/src/shared.ts
@@ -149,7 +149,9 @@ export class Broadcast extends Subscribable {
   context: any
 
   setContext(context: any) {
-    this.context = context
+    if (!this.context) {
+      this.context = context
+    }
   }
   getContext() {
     return this.context