antd checkbox根据后端动态更改选中

getColumns = () => {
        axios({
            'method': "get",
            'url': "http://xx"
        }).then(response => {
            var res = response.data
            if (res.status) {
                var arr = res.data.map(item => {
                    return {
                        title: item.name,
                        dataIndex: item.name,
                        align: "center",
                        render: (obj, record) => {
                            let currentP = item['permissions'][record.value] || {}
                            console.log(currentP);
                            return (
                                <Checkbox onChange={onChange} />
                            )
                        }
                    }
                })
                console.log(arr);
                arr.unshift({
                    title: "权限",
                    dataIndex: "cn_permission",
                    align: 'center'
                })
                this.setState(
                    { arr: arr }
                )
                var arr = []
                Object.keys(res['data'][0]['permissions']).forEach((permission, index) => {
                    var obj = {}
                    obj['node_order'] = index
                    obj['cn_permission'] = res['data'][0]['permissions'][permission].name
                    obj['en_permission'] = permission
                    res.data.forEach((role) => {
                        obj[role.name] = {
                            'id': role.id, value: role['permissions'][permission].value
                        }
                    })
                    arr.push(obj)
                });
                this.setState(
                    { datas: arr }
                )
            } else {
            }
            //console.log(textColumn);
        }).catch(error => {
        })
    };

 <Table
                    style={{ textAlign: 'center' }}
                    columns={arr}
                    dataSource={datas}
                    rowKey="permissions"
                    bordered
                    pagination={false}
                />

其中后端返回数据格式为类似如下结构:

[
    {
        "id": "3",
        "name": "系统管理员",
        "description": "a",
        "permissions": {
            "manage_company_user": {
                "name": "管理集团用户",
                "value": false
            },
            "manage_foreign_user": {
                "name": "管理外部用户",
                "value": false
            },
            "add_and_edit_project": {
                "name": "新建项目和编辑项目",
                "value": false
            },
            "edit_project": {
                "name": "编辑项目",
                "value": false
            },
            "edit_project_custom_field": {
                "name": "编辑项目自定义属性",
                "value": false
            },
            "edit_project_users": {
                "name": "编辑项目人员",
                "value": false
            },
            "manage_system_role": {
                "name": "管理职责列表",
                "value": false
            },
            "manage_category": {
                "name": "管理分类",
                "value": false
            },
            "manage_workflow": {
                "name": "管理状态流转设定",
                "value": false
            },
        },
    },
]

怎么样使用类组件根据后端所返回数据的value的true/false默认选中checkbox,且怎么样在选中checkbox后点击保存按钮向后端修改value

参考链接

怎么样使用类组件根据后端所返回数据的value的true/false默认选中checkbox,
可以参考下这篇文章的思路,链接:https://blog.51cto.com/u_15127544/3791388
怎么样在选中checkbox后点击保存按钮向后端修改value
这个问题,我觉得这个实例讨论可以给你做参考,链接:https://developers.weixin.qq.com/community/develop/doc/000a0ac17ac3c03ea8dac377c51800

已私信,请查阅


<div class="col-sm-10">
    <label class="checkbox-inline">
    <input type="checkbox" name="role" value="1"> 管理员
    </label>
    <label class="checkbox-inline">
        <input type="checkbox" name="role" value="2"> 普通用户
    </label>
    <label class="checkbox-inline">
        <input type="checkbox" name="role" value="3"> 人力
    </label>
    <label class="checkbox-inline">
        <input type="checkbox" name="role" value="4"> 记者
    </label>
</div>  
var roles = returnData.roles;
    if(roles != null) {
        $.each(roles, function(key, value) {
            $("input[name='role'][value='"+value.roleId+"']").attr("checked", true);
        });
    }