合并

src/pages/staff/list/addRole.jsx

 import React, { useState, useEffect } from 'react';
-import { Checkbox, Input, Card, Form, Button,Row,Col } from 'antd';
+import { Checkbox, Input, Card, Form, Button, Row, Col, Spin } from 'antd';
 import { connect } from 'dva';
 import XForm, { FieldTypes } from '../../../components/XForm';
 import request from '../../../utils/request';
   const [dataMenuId, setDataMenuId] = useState([])
   const [dataButtonId, setDataButtonId] = useState([])
 
+  const [loading, setLoading] = useState(true);
+
   useEffect(() => {
     // 新增和编辑用一个页面
     if (props.location.query) {
   // 根据角色id查询当前的菜单及其按钮
   function buttonAndMenuList(params, ids) {
     request({ ...apis.role.buttonAndMenuList, urlData: { id: ids }, params: { ...params } }).then(data => {
+      setLoading(false)
       props.form.setFieldsValue({ roleName: data.roleName })
       console.log(data)
       setData(data)
 
       // 获取所有的权限Id
       if (data.sysMenuList) {
-        setDataMenuId(data.sysMenuList.map(item => item.menuId))
-        setDataButtonId((data.sysMenuList.map(item => item.sysButtonInMenu && item.sysButtonInMenu.map(btn => btn.btnId).join(',')).filter(f => f !== '').join(',').split(',')).map(a => parseInt(a)))
+        setDataMenuId(data.sysMenuList.map(item => item && item.menuId))
+        // setDataButtonId((data.sysMenuList.map(item => item.sysButtonInMenu && item.sysButtonInMenu.map(btn => btn.btnId).join(',')).filter(f => f !== '').join(',').split(',')).map(a => parseInt(a) ) )
+        setDataButtonId(data.sysButtonInMenu.map(item => item && item.btnId))
       }
   }).catch((err) => {
       console.log(err)
       
         const sumitMenu = userMenus.filter(item => dataMenuId.includes(item.menuId))
         const sumitBtn = buutonDate.filter(item => dataButtonId.includes(item.btnId))
-        // console.log('sumitMenu', sumitMenu)
-        // console.log('sumitBtn', sumitBtn)
-        // console.log('sumitMenu', sumitMenu)
-        // const sumitBut = data.sysMenuList[0].sysButtonInMenu.concat(but)
         updateAuthMenu({ sysMenu: sumitMenu, name: values.roleName, id: props.location.query.id, sysButton: sumitBtn })
       } else {
         updateAuthMenu({ sysMenu: menus, name: values.roleName, id: props.location.query.id, sysButton: but })
     });
   }
   const { getFieldDecorator } = props.form;
+  
   return (
     <>
       <div>
+      <Spin spinning={ loading } size="large">
         <Form labelCol={{ span: 6 }} wrapperCol={{ span: 12 }} onSubmit={handleSubmit}>
           <Form.Item label="角色名称">
             {getFieldDecorator('roleName', {
           </Button>
           </Form.Item>
         </Form>
+        </Spin>
       </div>
     </>
   )