fix array table will show labels wrapped by form card

alibaba · Jun 15, 2019 · 60e0917 · 60e0917
2 parents c8cb1d3 + 68ed3a3
commit 60e0917
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 16 deletions.
diff --git a/docs/Examples/antd/Relations.md b/docs/Examples/antd/Relations.md
@@ -361,7 +361,7 @@ ReactDOM.render(<App />, document.getElementById('root'))
 #### Demo 示例
 
 ```jsx
-import React from 'react'
+import React,{useState,useEffect} from 'react'
 import ReactDOM from 'react-dom'
 import { filter, withLatestFrom, map, debounceTime } from 'rxjs/operators'
 import {
@@ -381,7 +381,26 @@ import { Button } from 'antd'
 import Printer from '@uform/printer'
 import 'antd/dist/antd.css'
 
-const App = () => (
+
+const App = () => {
+  const [values,setValues] = useState({})
+  useEffect(()=>{
+    setTimeout(()=>{
+      setValues({
+        aa: [
+          {
+            bb: 'aaaaa',
+            dd: [{ ee: '是', ff: '是' }]
+          },
+          {
+            bb: 'ccccc',
+            dd: [{ ee: '否', ff: '是' }]
+          }
+        ]
+      })
+    },1000)
+  },[])
+  return (
   <Printer>
     <SchemaForm
       effects={($, { setFieldState, getFieldState }) => {
@@ -460,14 +479,7 @@ const App = () => (
         })
       }}
       onSubmit={v => console.log(v)}
-      defaultValue={{
-        aa: [
-          {
-            bb: 'aaaaa',
-            dd: [{ ee: '是', ff: '是' }]
-          }
-        ]
-      }}
+      initialValues={values}
     >
       <FormBlock title="Block1">
         <Field type="array" name="aa">
@@ -522,5 +534,6 @@ const App = () => (
     </SchemaForm>
   </Printer>
 )
+}
 ReactDOM.render(<App />, document.getElementById('root'))
 ```
diff --git a/packages/antd/src/fields/cards.js b/packages/antd/src/fields/cards.js
@@ -20,7 +20,7 @@ const FormCardsField = styled(
 
     renderEmpty(title) {
       return (
-        <Card title={title} className='card-list'>
+        <Card style={this.getProps('style')} title={title} className='card-list'>
           {super.renderEmpty()}
         </Card>
       )

diff --git a/packages/antd/src/form.js b/packages/antd/src/form.js
@@ -453,7 +453,16 @@ const isTableColItem = (path, getSchema) => {
 
 registerFieldMiddleware(Field => {
   return props => {
-    const { name, errors, editable, path, required, schema, getSchema } = props
+    const {
+      name,
+      errors,
+      editable,
+      path,
+      required,
+      schema,
+      schemaPath,
+      getSchema
+    } = props
     if (path.length === 0) return React.createElement(Field, props) // 根节点是不需要包FormItem的
     return React.createElement(
       FormConsumer,
@@ -479,7 +488,7 @@ registerFieldMiddleware(Field => {
             label: schema.title,
             noMinHeight: schema.type === 'object' && !schema['x-component'],
             isTableColItem: isTableColItem(
-              path.slice(0, path.length - 2),
+              schemaPath.slice(0, schemaPath.length - 2),
               getSchema
             ),
             type: schema['x-component'] || schema['type'],

diff --git a/packages/next/src/fields/cards.js b/packages/next/src/fields/cards.js
@@ -20,7 +20,7 @@ const FormCardsField = styled(
 
     renderEmpty(title) {
       return (
-        <Card title={title} className='card-list' contentHeight='auto'>
+        <Card style={this.getProps('style')} title={title} className='card-list' contentHeight='auto'>
           {super.renderEmpty()}
         </Card>
       )

diff --git a/packages/next/src/form.js b/packages/next/src/form.js
@@ -356,7 +356,16 @@ const isTableColItem = (path, getSchema) => {
 
 registerFieldMiddleware(Field => {
   return props => {
-    const { name, editable, errors, path, schema, getSchema, required } = props
+    const {
+      name,
+      editable,
+      errors,
+      path,
+      schemaPath,
+      schema,
+      getSchema,
+      required
+    } = props
     if (path.length === 0) return React.createElement(Field, props) // 根节点是不需要包FormItem的
     return React.createElement(
       FormConsumer,
@@ -382,7 +391,7 @@ registerFieldMiddleware(Field => {
             label: schema.title,
             noMinHeight: schema.type === 'object' && !schema['x-component'],
             isTableColItem: isTableColItem(
-              path.slice(0, path.length - 2),
+              schemaPath.slice(0, schemaPath.length - 2),
               getSchema
             ),
             type: schema['x-component'] || schema['type'],