无法从“ React JS”中的“ restraps”中增加模态的宽度

问题描述 投票:0回答:1
export class A extends Component {
    constructor(props) {
        super(props)

        this.state = {
            collapse: false,

            divWidth: {
                width: 700,
            }

        }
        this.toggle = this.toggle.bind(this);


    }
    toggle() {
        this.setState(state => ({ collapse: !state.collapse }));
    }

    render() {
        const data = [{
            name: 'Ayaan',
            age: 26
        }, {
            name: 'Ahana',
            age: 22
        }]
        const columns = [{
            Header: 'Name',
            accessor: 'name'
        }, {
            Header: 'Age',
            accessor: 'age'
        }]

        return (
            <div>
                <Button onClick={this.toggle} >
                    Click Button
                 </Button>
                <Modal isOpen={this.state.collapse} modalClassName={this.state.divWidth}>
                    <ModalHeader>Welcome</ModalHeader>
                    <ModalBody>
                        <div className="form-group">
                            <div>
                                <ReactTable
                                    data={data}
                                    columns={columns}
                                    defaultPageSize={2}
                                />
                            </div>
                      </div>
                    </ModalBody>
                </Modal>
            </div>
        )

    }
}

在上面的代码中,我无法增加模态的宽度(来自reactstrap),我们只能将宽度增加到500px。我在状态divWidth中添加了css属性,在其中我将宽度增加到700,但仍然无法正常工作。

reactjs
1个回答
0
投票
© www.soinside.com 2019 - 2024. All rights reserved.