在使用React单击Submit时尝试添加一些文本

SEE PICTURECan someone please help me to figure out why when I clicked on Submit I have just a new tab showing and not the text. i have attached a picture so you can see what's showing when I clicked on the submit button.

import React, { Component } from 'react'
export default class TodoList extends Component {
    constructor(props) {
        super(props)
        this.state = {
            todo:"",
            completed: "",
            itemList: [
                { todo: "Take out the Trash", completed: true },
                { todo: "Water the plants", completed: false },
                { todo: "Grocery shopping", completed: true }
              ]
        }
        this.handleChange = this.handleChange.bind(this)
        this.handleSubmit = this.handleSubmit.bind(this)
    }
    handleChange(e) {
        this.setState({todo: e.target.value});
    }
    handleSubmit(n) {
       this.setState({
           itemList: [...this.state.itemList, this.state.todo],
       });
    }
    render() {
        return (
            <div className="container">
                <div className="main">
                    <div>
                 <input className="header w-50 p-2" type="text" placeholder="enter task" value={this.state.todo} onChange={this.handleChange}/><br></br>
                 <button className="button btn-btn-primary ml-1 mt-3" onClick={this.handleSubmit}>Submit</button>
                 </div>
                 <div>
        {this.state.itemList.map((item, index) => (<p className="mt-4 list" key={index}>{item.todo}{item.completed} <input type="checkbox" /></p>))}
                 </div>
                 </div> 
                 </div>
        )
    }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

弄清楚为什么当我单击“提交”时,我只显示一个新选项卡,而不显示文本