首页 > react-bootstrap Modal框怎么传值

react-bootstrap Modal框怎么传值

点击“推荐”打开“推荐模态框”

下面是代码部分:

return (


            <div>
                <InformationSearch {...this.props} />
                {gridInstance}
                <TableExit data={rows} changePageNum={this.changePageNum.bind(this)} changePageSize={this.changePageSize.bind(this)}>
                    <TableCloumnsExit dataField="alter" dataFormat={this.checkboxFormatter.bind(this)}>选择</TableCloumnsExit>
                    <TableCloumnsExit dataField="operation" dataFormat={this.recommendFormatter.bind(this)}>操作</TableCloumnsExit>
                    <TableCloumnsExit dataField="title" dataFormat={this.titleFormatter.bind(this)}>文章标题</TableCloumnsExit>
                    <TableCloumnsExit dataField="source">文章来源</TableCloumnsExit>
                    <TableCloumnsExit dataField="showImgae" dataFormat={this.imagesShowFormatter.bind(this)}>文章图片</TableCloumnsExit>
                    <TableCloumnsExit dataField="getTime">采集时间</TableCloumnsExit>
                    <TableCloumnsExit dataField="postTime">推荐时间</TableCloumnsExit>
                    <TableCloumnsExit dataField="likeNum">点赞数</TableCloumnsExit>
                    <TableCloumnsExit dataField="readNum">阅读数</TableCloumnsExit>
                    <TableCloumnsExit dataField="nickName">编辑</TableCloumnsExit>
                    <TableCloumnsExit dataField="createdOn">创建时间</TableCloumnsExit>
                </TableExit>

                <Modal show={this.state.showModal} onHide={this.close.bind(this)}>
                    <Modal.Header closeButton>
                        <Modal.Title>推荐页面</Modal.Title>
                    </Modal.Header>
                    <Modal.Body>
                        <RecommendTo {...this.props} />
                    </Modal.Body>
                    <Modal.Footer>
                        <Button onClick={this.close.bind(this)}>Close</Button>
                    </Modal.Footer>
                </Modal>
            </div>
        );

<modal> 是弹出框组件
<TableExit> 是表组件

现在的问题是,在未弹出框组件时,所有的数据都是可以查到的,但是弹出框组件生效时,怎么把表组件中的数据传到弹出框中。
谢谢!


和你的showModal一样传过来。


javascript 中 有个对象是 parent 可以利用这个


看了你的问题描述,感觉你对 React 的数据传递不是很熟悉,导致数据的设计出了一些问题,基于你的问题:

  1. 在 React 中数据应该是自顶向下传递的,底层组件的数据最好是由顶层组件传递的(Container Component -> other component)

  2. 拥有表格数据和 modal 数据的组件应该是你的代码对应的最外层组件

  3. 所以表格数据在最外层组件,可以作为参数传递给 Modal 组件

【热门文章】
【热门文章】