antd 在class外部的modal如何获取Table列表的值?

class 内
 columns = [
        {
            title: '用户账号',
             dataIndex: 'uiAccount',
             key: 'uiAccount',
        },
        {
            title: '用户姓名',
            dataIndex: 'uiName',
            key: 'uiName',
        },
        {
            title: '邮箱',
            dataIndex: 'uiEmail',
            key: 'uiEmail',

        },
        {
            title: '用户备注',
            dataIndex: 'uiRemarks',
            key: 'uiRemarks',

        },
        {
            title: '角色',
            dataIndex: 'roles',
            key: 'roles',
            render: (text, record, index) => (
                <Fragment>
                    <Button type="primary" onClick={() => this.showModal(true, record)}>查看/设置</Button>

                </Fragment>
            ),
        },

        {
            title: '操作',
            dataIndex: 'caozuo',
            key: 'caozuo',
            render: (text, record, index) => (
                <Fragment>
                    <Button onClick={() => this.editUser(record)} type="primary">修改</Button>
                    <Divider type="vertical" />
                    <Button type="primary" onClick={() => this.delUser(record)}>删除</Button>
                </Fragment>
            ),
        },
    ];
    render(){
     <Table                     
                dataSource={list}
                columns={this.columns}
                onChange={this.handleStandardTableChange}
                rowKey={(record) => record.uiAccount}
           />
    }

点击修改后会有一个modal显示(代码在class外部) 需要显示点击行的值,
如果在点击之前 使用 form.setFieldsValue 会如下错误
clipboard.png
未显示的组件不会被form.getFieldDecorator注册
可以参考这个issue https://github.com/ant-design...
如果不想点修改之后从服务器获取数据,而是从Table里存储的数据获取,应该怎么写?

阅读 6.3k
2 个回答

自己写了方法实现了
在点击按钮的时候将行数据传入props,再用mapPropsToFields在filed初始化之后写入数据,比较绕,但是不用走服务器,可以节省流量

因为 mapPropsToFields 是在 Field 被初始化的时候调用的。而 setFieldsValue 调用时,Field 还未被初始化。

把这个modal的挂载点设置到class内,就可以获取到了。

<Modal getContainer={document.getElementById('your mount dom')}/>
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题