Ant Design Drawer Modal (抽屉中套了一层弹出框)

描述：

   最近用Ant Design 的 Drawer   和 Modal 出现一个问题， 在Drawer   含有  Modal ，Drawer   显示数据 ，Modal新增和编辑数据，

然后打开Modal 的时候就发现使用组件就会直接报错

 

element.nodeName.toLowerCase is not a function

 

解决办法：

 注意下面的name和namemodal的不同，提交时要重新塞值

    

const example = props => {

 

const [formModel] = Form.useForm();

const columnsVideo=[
  {
    title: '序号',
    key: 'index',
    render: (text,record,index) => (index+1),
  },
  {
    title: '名称',
    key: 'name',
    dataIndex:'name',
  },
];

return (
<Drawer
  destroyOnClose  
  visible={true}
>

<Table rowKey="id" dataSource={{id:1,name:"xioaioxa"}}
       columns={columnsVideo}
       size="middle"/>

 

<Modal
  destroyOnClose
   visible={false}
>

 

<Form
  form={formModel}
>

<FormItem name="nameModel" label="姓名"   rules={[
  {
    required: true,
    message: '请输入！',
  },
]}>
  <Input placeholder="请输入" />
</FormItem>

</Form>

 

</Modal>

</Drawer>
);
}