fix

src/module/productModule/index.ts

+export interface IProductModule {
+  productName: string;
+  productSelectAttribute: any[];
+  selectedGoods: any[];
+  tableDataSource: any[];
+
+  setProductName(name: string):void;
+  setProductSelectAttribute(list: any[]):void;
+  setSelectedGoods(lists: any[]):void;
+  setTableDataSource(datas: any[]):void;
+}

src/pages/commodity/products/addProducts.tsx

-import React, { useState, useRef, useEffect } from 'react'
+import React, { useState, useRef, useEffect, createContext } from 'react'
 import { history } from 'umi';
 import { Button, Card, Tabs } from 'antd'
 import { PageHeaderWrapper } from '@ant-design/pro-layout'
@@ -21,9 +21,12 @@ const { TabPane } = Tabs
 const AddProducts: React.FC<{}> = (props) => {
 
   const [attributeList, setAttributeList] = useState<any[]>([])
+  let [formRefs, setFormRefs] = useState([]) //子form的ref数组
+
 
   const onSave = () => {
     console.log('点击保存')
+    console.log(formRefs, 'formrefs')
   }
 
   const callback = (key: any) => {
@@ -45,16 +48,23 @@ const AddProducts: React.FC<{}> = (props) => {
     <Card>
       <Tabs onChange={callback} type="card" defaultActiveKey="1">
         <TabPane tab="基本信息" key="11">
-          <BasicInfoForm onChangeAttributeList={(_lists: any)=>setAttributeList(_lists)} />
+          <BasicInfoForm 
+            onRef={(refs)=>setFormRefs([...formRefs, refs])}
+            onChangeAttributeList={(_lists: any)=>setAttributeList(_lists)} />
         </TabPane>
         <TabPane tab="选择货品" key="22">
           <SelectGoodsForm />
         </TabPane>
         <TabPane tab="商品属性" key="33">
-          <ProductAttributeForm attributesData={attributeList} />
+          <ProductAttributeForm 
+            onRef={(refs)=>setFormRefs([...formRefs, refs])}
+            attributesData={attributeList}
+          />
         </TabPane>
         <TabPane tab="价格设置" key="44">
-          <PriceAttributeForm />
+          <PriceAttributeForm
+            onRef={(refs)=>setFormRefs([...formRefs, refs])}
+          />
         </TabPane>
         <TabPane tab="商品图片" key="55" style={{ border: '1px solid rgba(223,225,230,1)' }}>
           <ProductImageForm />
@@ -63,10 +73,14 @@ const AddProducts: React.FC<{}> = (props) => {
           <ProductDescForm />
         </TabPane>
         <TabPane tab="物流信息" key="77">
-          <LogisticsForm/>
+          <LogisticsForm
+            onRef={(refs)=>setFormRefs([...formRefs, refs])}
+          />
         </TabPane>
         <TabPane tab="其他" key="88">
-          <OtherForm />
+          <OtherForm
+            onRef={(refs)=>setFormRefs([...formRefs, refs])}
+          />
         </TabPane>
       </Tabs>
     </Card>

src/pages/commodity/products/addProductsItem/logisticsForm.tsx

-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect, useRef } from 'react'
 import {history} from 'umi'
 import { Button, Form, Select, Checkbox, Tooltip, Radio, Input, Table, Modal, Row, Col } from 'antd'
 import styles from './index.less'
@@ -17,21 +17,29 @@ const layout = {
 }
 
 export interface Iprops {
-  
+  onRef: (refs: any) => void;
 }
 
 const { Option } = Select
 
 const LogisticsForm: React.FC<Iprops> = (props) => { 
+  const { onRef } = props
+
+  const logisticsFormRef = useRef()
   const [logisticsForm] = Form.useForm()
 
+  useEffect(()=>{
+    //传入ref给父级
+    onRef(logisticsFormRef)
+  }, [])
 
   return (<>
     <Form
       {...layout}
       form={logisticsForm}
-      name="add-products-transport"
+      name="logistic-form"
       labelAlign="left"
+      ref={logisticsFormRef}
     >
       <Form.Item
         name="transportType"

src/pages/commodity/products/addProductsItem/otherForm.tsx

-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect, useRef } from 'react'
 import {history} from 'umi'
 import { Button, Form, Select, Checkbox, Tooltip, Radio, Input, Table, Modal, Row, Col } from 'antd'
 import styles from './index.less'
@@ -17,22 +17,29 @@ const layout = {
 }
 
 export interface Iprops {
-  
+  onRef: (refs: any) => void; 
 }
 
 const { Option } = Select
 const { TextArea } = Input
 
 const OtherForm: React.FC<Iprops> = (props) => { 
+  const { onRef } = props
+  const otherFormRef = useRef()
   const [otherForm] = Form.useForm()
 
+  useEffect(()=>{
+    //传入ref给父级
+    onRef(otherFormRef)
+  }, [])
 
   return (<>
     <Form
       {...layout}
       form={otherForm}
-      name="add-products-other"
+      name="other-form"
       labelAlign="left"
+      ref={otherFormRef}
     >
       <Form.Item
         name="bill"

src/pages/commodity/products/addProductsItem/productAttributeForm.tsx

-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect, useRef, useContext } from 'react'
 import {history} from 'umi'
 import { Button, Form, Select, Checkbox, Tabs, Input } from 'antd'
 import styles from './index.less'
@@ -7,6 +7,11 @@ import { StandardTable } from 'god'
 import { ColumnType } from 'antd/lib/table/interface'
 import { EyeOutlined } from '@ant-design/icons'
 
+import { inject, observer } from 'mobx-react'
+// import { IProductModule } from '@/module/productModule'
+// import { IStore } from '@/store';
+import { store } from '@/store'
+
 const layout = {
   labelCol: {
     span: 2,
@@ -24,6 +29,7 @@ const tailLayout = {
 
 export interface Iprops {
   attributesData: any[];
+  onRef: (refs: any) => void;
 }
 
 const { TabPane } = Tabs
@@ -31,8 +37,15 @@ const { Option } = Select
 const { TextArea } = Input
 
 const ProductAttributeForm: React.FC<Iprops> = (props) => { 
-  const { attributesData } = props
+  const { attributesData, onRef } = props
+  const productAttributeFormRef = useRef()
   const [attributeForm] = Form.useForm()
+  const { ProductStore } = store
+
+  useEffect(()=>{
+    //传入ref给父级
+    onRef(productAttributeFormRef)
+  }, [])
   
   let paramsArray = [];
 
@@ -47,7 +60,7 @@ const ProductAttributeForm: React.FC<Iprops> = (props) => {
    * @param {Object} attrItem 属性数据对象
    */
   const onChange = (value, attrItem) => {
-    let params = { customerAttributeId: attrItem.id, customerAttributeValueList: [] }
+    let params = { customerAttributeId: attrItem.id, attributeName: attrItem.name, isPrice: attrItem.isPrice, customerAttributeValueList: [] }
     if(attrItem.type!==3){
       for(let item of attrItem?.customerAttributeValueList){
         if(value?.length){
@@ -55,7 +68,7 @@ const ProductAttributeForm: React.FC<Iprops> = (props) => {
             if(item.id===i){
               params.customerAttributeValueList.push({
                 customerAttributeValueId: i,
-                value: item.value
+                value: item.value,
               })
             }
           }
@@ -63,7 +76,7 @@ const ProductAttributeForm: React.FC<Iprops> = (props) => {
           if(item.id===value){
             params.customerAttributeValueList.push({
               customerAttributeValueId: value,
-              value: item.value
+              value: item.value,
             })
           }
         }
@@ -71,7 +84,7 @@ const ProductAttributeForm: React.FC<Iprops> = (props) => {
     }else{
       params.customerAttributeValueList.push({
         customerAttributeValueId: null,
-        value: value.target.value
+        value: value.target.value,
       })
     }
     paramsArray.push(params)
@@ -80,8 +93,8 @@ const ProductAttributeForm: React.FC<Iprops> = (props) => {
       item[next.customerAttributeId] = next;
       return item
     },{}))
-
-    console.log(resultParams) // 最终转换的数据格式
+    console.log(resultParams, 'resultParams') // 最终转换数据
+    ProductStore.setProductSelectAttribute(resultParams) //注入mobx
   }
 
   const renderTabPanchildren = (attrItem: any) => {
@@ -123,7 +136,7 @@ const ProductAttributeForm: React.FC<Iprops> = (props) => {
             <Checkbox.Group onChange={(v)=>onChange(v, attrItem)}>
               {
                 attrItem?.customerAttributeValueList.length > 0 && attrItem.customerAttributeValueList.map((item: any, index: string) => (
-                  <Checkbox key={item.id} value={item.id}>{item.value}</Checkbox>
+                  <Checkbox key={item.id + index} value={item.id}>{item.value}</Checkbox>
                 ))
               }
             </Checkbox.Group>
@@ -153,6 +166,7 @@ const ProductAttributeForm: React.FC<Iprops> = (props) => {
       name="attribute-form"
       labelAlign="left"
       onFinish={onFinish}
+      ref={productAttributeFormRef}
     >
       <Tabs defaultActiveKey="1" tabPosition="left">
         {
@@ -179,4 +193,4 @@ const ProductAttributeForm: React.FC<Iprops> = (props) => {
   </>)
 }
 
-export default ProductAttributeForm
\ No newline at end of file
+export default observer(ProductAttributeForm)
\ No newline at end of file

src/pages/commodity/products/addProductsItem/selectGoodsForm.tsx

-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect, useContext } from 'react'
 import {history} from 'umi'
 import { Button, Form, Select, Checkbox } from 'antd'
 import styles from './index.less'
@@ -7,6 +7,11 @@ import { StandardTable } from 'god'
 import { ColumnType } from 'antd/lib/table/interface'
 import { EyeOutlined } from '@ant-design/icons'
 
+import { inject, observer } from 'mobx-react'
+// import { IProductModule } from '@/module/productModule'
+// import { IStore } from '@/store';
+import { store } from '@/store'
+
 const layout = {
   labelCol: {
     span: 2,
@@ -22,9 +27,10 @@ export interface Iprops {
 
 const SelectGoodsForm: React.FC<Iprops> = (props) => { 
   const [selectGoodsForm] = Form.useForm()
-  const [showSelectGoods, setSelectGoods] = useState(false)
+  const [showSelectGoods, setIsSelectGoods] = useState(false)
   const [selectGoodsRow, setSelectGoodsRow] = useState<any[]>([]) // 模态框选择的行数据
   const [selectedGoodsRowKeys, setSelectedGoodsRowKeys] = useState<Array<number>>([])
+  const { ProductStore } = store
 
   const fetchData = (params: any) => {
     console.log(params)
@@ -78,12 +84,13 @@ const SelectGoodsForm: React.FC<Iprops> = (props) => {
 
   const onSelectGoodsChange = (value: any) => {
     setSelectedGoodsRowKeys([])
-    setSelectGoods(value.target.checked)
+    setIsSelectGoods(value.target.checked)
   }
 
   const rowSelection = {
     selectedRowKeys: selectedGoodsRowKeys,
     onChange: (selectedRowKeys: any, selectedRows: any) => {
+      ProductStore.setSelectedGoods(selectedRows)
       setSelectGoodsRow(selectedRows);
       setSelectedGoodsRowKeys(selectedRowKeys);
       console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
@@ -112,4 +119,4 @@ const SelectGoodsForm: React.FC<Iprops> = (props) => {
   </>)
 }
 
-export default SelectGoodsForm
\ No newline at end of file
+export default observer(SelectGoodsForm)
\ No newline at end of file

src/store/index.tsx

 import UserStore from './user'
 import ThemeStore from './theme'
+import ProductStroe from './product'
 import React from 'react';
 import { Provider } from 'mobx-react'
 import { IUserModule } from '@/module/userModule';
+import { IProductModule } from '@/module/productModule'
+// import { ProductContext } from '@/pages/commodity/products/addProducts';
 
 /**
  * 
@@ -20,12 +23,14 @@ import { IUserModule } from '@/module/userModule';
  */
 
 export interface IStore {
-  userStore: IUserModule
+  userStore: IUserModule;
+  ProductStore: IProductModule;
 }
 
-const store = {
+export const store = {
   userStore: new UserStore,
   ThemeStore: new ThemeStore,
+  ProductStore: new ProductStroe
 }
 
 const MobxProvider: React.FC = (props) => {

src/store/product/index.ts

+import {action, computed, observable, runInAction} from 'mobx'
+import { IProductModule } from '@/module/productModule'; // mobx要用到的数据类型
+
+class ProductStore implements IProductModule {
+  @observable public productName: string = "";
+  @observable public productSelectAttribute: any[] = [];
+  @observable public selectedGoods: any[] = [];
+  @observable public tableDataSource: any[] = [];
+
+  /** 定义动作区块，外部调用，改变对应的状态 **/
+  // 可以改变存的testText值
+  @action.bound
+  public setProductName(name: string) {
+    this.productName = name;
+  }
+
+  @action.bound
+  public setProductSelectAttribute(list: any[]) {
+    this.productSelectAttribute = list;
+  }
+  
+  @action.bound
+  public setSelectedGoods(list: any[]) {
+    this.selectedGoods = list;
+  }
+
+  @action.bound
+  public setTableDataSource(datas: any[]) {
+    console.log(datas, 'innerBox')
+    this.tableDataSource = datas;
+  }
+  
+}
+
+export default ProductStore