Todo list with react

react-test-todolist.js

import React, { Component } from 'react';
import './App.css';

class App extends Component {
    state = {
        inputText : '',
        data: []
    };

    onInputChanges = (event) => {
        this.setState({
            inputText: event.target.value
        })
    };

    onButtonClick = () => {
        this.setState({
            data: [
                ...this.state.data,
                this.state.inputText,
            ],
            inputText: ''
        })
    };
    render() {
        return (
            <div className="App">
                <div>
                    <input
                        type="text"
                        placeholder="insert todo list"
                        value={this.state.inputText}
                        onChange={this.onInputChanges}
                    />
                    <button type="submit" onClick={this.onButtonClick}>Submit</button>
                </div>
                <div>
                    {this.state.data.length > 0 && (
                        <ul>
                            {this.state.data.map((list, key) => {
                                return (
                                    <li key={key}>{list}</li>
                                );
                            })}
                        </ul>
                    )}
                </div>
            </div>
        );
    }
}

export default App;