Skip to content
Snippets Groups Projects
Select Git revision
  • 3bdcbbe0992f785d7d58816f3de86dbbc012da01
  • master default protected
2 results

MList.js

Blame
  • MList.js 3.48 KiB
    import React from 'react'
    import request from '../request'
    import { withRouter } from 'react-router-dom'
    
    class MList extends React.Component {
        constructor(props) {
            super(props);
            this.state = {
                Lists: [],
                click: false,
                content : "",
                title: ""
            }
        }
        showDes = e => {
            this.setState({
                click: true
            })
            this.state.Lists.map(list => {
                if(list.title === e.target.innerText) {
                    this.setState({
                        content: list.description,
                        title: list.title
                    })
                }
            })
        }
        Goback = e => {
            this.setState({
                click: false
            });
            this.props.history.push('/match');
        }
        componentDidMount() { 
            request.getMatchList().then().then(data => {
                this.setState({
                    Lists: data
                })
            });
        }
        render() {
            const format = [];
            const number = []
            if(this.state.Lists.length > 0) {
                this.state.Lists.map(list => {
                    number.push(1);
                    format.push(<tr></tr>)
                    format.push(<td>{number.length}</td>)
                    format.push(<td onClick={this.showDes}>{list.title}</td>)
                });
            }
            if(this.state.click === true) {
                return(
                    <div>
                        <div className="form_container">
                            <div className="form_title_div">
                                <p className="form_title_p">게시물</p>
                            </div>
                            <div>
                                <div>
                                    <p className="form_item_name">title</p>
                                </div>
                                <div>
                                    <input type="text" className="form_input" value={this.state.title}/>
                                </div>
                                <div className="form_text_alert_padding">
                                    <div id="alert_username" className="form_text_alert"></div>
                                </div>
                            </div>
                            <div>
                                <div>
                                    <p className="form_item_name">Content</p>
                                </div>
                                <div>
                                    <textarea className="form_input" value={this.state.content}/>
                                </div>
                                <div className="form_text_alert_padding">
                                    <div id="alert_password" className="form_text_alert"></div>
                                </div>
                            </div>
                            <div>
                                <button type="button" className="form_submit_button" onClick={this.Goback}>Back</button>
                            </div>
                        </div>
                    </div>
                                
                ) 
            } else {
                return(
                    <div className="showList">
                        <table>
                            <tr>
                                <th>Index</th>
                                <th>Title</th>
                            </tr>
                            {format}
                        </table>
                    </div>            
                ) 
            } 
        }
    }
    
    export default withRouter(MList)