react bootstrap:如何从模态按钮发送表单

时间:2016-12-02 06:30:08

标签: javascript reactjs react-bootstrap

这是我的组件的层次结构

class MyDialog extends Component {

    static propTypes = {
        children: PropTypes.node,
        show: PropTypes.bool
    };

    onClick() {
        // submit form
    }

    render() {
        return (
            <Modal show={this.props.show}>
                <Modal.Body>
                    {this.props.children}
                </Modal.Body>
                <Modal.Footer>
                    <Button onClick={::this.onClick}>Submit</Button>
                </Modal.Footer>
            </Modal>
        );
    }
}    

class MyForm extends Component {

    onSubmit() {
        // ajax call
    }

    render() {
        return (
            <Form onSubmit={::this.onSubmit}/>
        );
    }
}

class MyComponent extends Component {
    render() {
        <MyDialog show={true}>
            <MyForm>
        </MyDialog>
    }
}

我想知道使用模态对话框中的按钮发送表单的正确方法是什么

还有可能我想重用一些其他内容而不是表单的对话框

0 个答案:

没有答案