CommentList.js：
<button
type="submit"
className="btn btn-danger btn-sm ml-3"
onClick={(e) => {this.props.onDeleteComment(e)}}
>
删除
</button>我在CommentList.js中增加了一个删除的button，点击按钮，可以调用App.js中的deleComment()方法，但是这个方法中一旦获取this.state.comments就报错，说是获取不到comments。
App.js：
deleComment(){
// console.log(111)
const comments = this.state.comments
console.log(comments)
}<CommentList
comments={comments}
onDeleteComment = {this.deleComment}
/>
2018-10-27
// 我来写一下删除按钮的生成与功能的实现，我是后端，没学过ECMAScript
// 只是单单实现了这个功能，不知道在实现上对不对
// 当时老师写这个组件的时候用的是函数式，我个人感觉这里使用函数式不方便就改成了类
// 还有就是不需要把当前组件的事件转移到App.js中的吧
import React from 'react'
class CommentList extends React.Component{
constructor(props){
super(props)
this.removeElement = this.removeElement.bind(this)
}
removeElement(event){
event.target.parentElement.remove()
}
render() {
const {comments} = this.props
return (
<div className="comment-list-component">
<label htmlFor="">评论列表</label>
<ul className="list-group mb-3">
{
comments.map((comment, index) =>
<li key={index} className="list-group-item">{comment}
<a
className="btn btn-link text-danger"
onClick={this.removeElement}
>删除</a>
</li>
)
}
</ul>
</div>
)
}
}
export default CommentList
举报
