Как отобразить таблицу, нажмите на ссылку на той же странице? - PullRequest
0 голосов
/ 18 февраля 2019

У меня есть две ссылки. Если я нажимаю одну ссылку, она открывает модальное окно, нажимаю ли я на другую ссылку, чтобы открыть таблицу на той же странице.

state = {visible: false, showTable: false}

showCourseModal = () => {
    this.setState({
        visible: true,
    });
}

onOk = (e) => {
    this.setState({
        visible: false,
    })

}

showStudentList = () => {
    this.setState({
        visible: true,
    })

}


render() {
    return (
        <div align="center">
        <a href="#" onClick={this.showCourseModal}>Course</a>
        <a href="#" onClick={this.showStudentList}>StudentList</a>
            <CourseModal
                visible={this.state.visible}
                onOk={this.onOk}
                onCancel={this.onCancel} />
                <StudentListtable showtable={this.state.showTable} data={data}/>

        </div>
    )
}

}

если я нажму на список учеников, на той же странице будет отображаться таблица StudentListTia.iam, получающая данные с использованием файла student.json. Как их отобразить?

         state = {
               showTable: this.props.showTable,
              }
            render() {

                return (
                    <div>
                        <div align="right">
                            <Button
                                type="primary">Update</Button>
                        </div>
                        <Table
                            dataSource={this.props.data}
                            showTable={this.props.showTable}
                            columns={columns}
                            pagination={{ pageSize: 5 }}

                        />
                    </div>
                )
            }

        }

1 Ответ

0 голосов
/ 18 февраля 2019

Вы не используете showTable.showStudentlist обновляет видимый

showStudentList = () => {
    this.setState({
        visible: true, <---Wrong, should be showTable: true
    })

}
...