你写的很认真。点赞！ 有几点可以改进，1 删除的回调函数也许不需要传入 e 这个event object，直接把 index 传入岂不是更好？ 2 在 deleteComment 方法中，你选用了 splice 来删除，splice 是个 mutable 的方法，当然也没问题，也可以试试用 数组上面的 filter 方法，这个函数是 immtuable 的，而且更好理解。3 既然 clickHandler 里面只有一行，是不是可以试试直接用箭头函数作为回调？ 例如 onClick={(e)=> { .... }}

清空操作可以试试在提交的时候进行，也就是在handleSubmit()方法中，添加

this.textInput.value = ''

emmmm......我觉得不用这样的，加一个函数

componentDidUpdate(prevProps, prevState, snapshot) {
    document.getElementById('comment').value = ""
}

刚问完发现是老师留的作业……那我就自问自答一下吧：

在CommentBox.js里的handleSubmit里加上一句： 

this.textInput.value=""

即可

加删除按钮比较麻烦点，CommentList.js文件中，把ul标签修改如下：

<ul className="list-group mb-3">
{    
    this.props.comments.map((comment, index) =>        
        <li key={index} className="list-group-item">{comment}
        <button
            type="button"
            className="btn btn-danger btn-sm"
            data-index={index}
            onClick={this.clickHandler}
         >
         删除
         </button>
         </li>
     )
}
</ul>

同时加入clickHandler方法

clickHandler(e) {
    this.props.onDeleteComment(e)
}

最后，在App.js里，首先把CommentList标签加入onDeleteComment属性

<CommentList comments={comments} onDeleteComment={this.deleteComment} />

再加入deleteComment方法：

deleteComment(e) {
    const index = e.target.getAttribute("data-index");
    let newComments = this.state.comments
    newComments.splice(index, 1)
    this.setState({
        comments: newComments
    })
}

我在删除按钮上加了一个data-index属性用来传递comment的index，不确定好不好，也不知道有没有更好的方法。欢迎大家讨论，也请老师指点。