Question

我已经创建了额外的提交模式，以便在他决定从收藏中删除帖子后收到用户确认，而我无法弄清楚如何定位帖子。

我想问你的另一件事是生产力问题，将GC.SuppressFinalize(this);组件插入每个DeletePost组件是否明智，或者有办法将其插入currentPage组件中并以某种方式将模态调用绑定到帖子。

以下是post组件的代码：

DeletePost

以下是从class DeletePost extends Component { handleDelete(event) { event.preventDefault(); Meteor.call('posts.remove', post); $('#modalDelete').modal('hide'); } render() { return ( <div className="modal fade form-delete" id="modalDelete" tabIndex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div className="form-outer"> <form id='delete_post' onSubmit={this.handleDelete.bind(this)}> <div className='form-text form-header'> <p>My dear, <strong>master</strong></p> <p>Are you really sure about that?</p> </div> <button type="button" className="form-button button-delete" data-dismiss="modal">No</button> <button type="sumbit" className="form-button button-delete">Yes</button> </form> </div> </div> ); } }导入Post组件的代码：

DeletePost

Answer 1

您必须将post值从其父项传递给child：

你的PostsList类需要将post值传递给child。

class PostsList extends Component {
  renderData(){
    return this.props.posts.map(post => {
      const {title, social, link, link_image, time=moment(post.createdAt).fromNow()} = post;
      return (
        <div key={post._id} className='social-post'>
          <img src={link_image}></img>
          <p>{social}, {time}</p>
          <a className='social-link' target="_blank" href={link}>{title}</a>
          <div className='list-buttons'>
            <button className='form-button button-gradient'>Edit</button>
            <button type="button" className='form-button button-gradient'  data-toggle="modal" data-target="#modalDelete">Delete</button>
          </div>

          <DeletePost post={post}/>
        </div>
      );
    })
  }

  render() {
    return (
      <div className='flex-timeline'>
        {this.renderData()}
      </div>
    );
  }
}

您的DeletePost使用this.props.post访问来自父级的数据。

class DeletePost extends Component {

  handleDelete(event) {
    event.preventDefault();
    Meteor.call('posts.remove', this.props.post);
    $('#modalDelete').modal('hide');
  }

  render() {
    return (
        <div className="modal fade form-delete" id="modalDelete" tabIndex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
          <div className="form-outer">
            <form id='delete_post' onSubmit={this.handleDelete.bind(this)}>
                <div className='form-text form-header'>
                  <p>My dear, <strong>master</strong></p>
                  <p>Are you really sure about that?</p>
                </div>
                <button type="button" className="form-button button-delete" data-dismiss="modal">No</button>
                <button type="sumbit" className="form-button button-delete">Yes</button>
            </form>
          </div>
        </div>
    );
  }
}

使用提交模式的Meteor-React删除帖子（帖子未定义）

1 个答案: