如何创建关注者/关注图标react / redux

时间:2016-10-04 09:34:30

标签: reactjs mongoose webpack redux react-router

我已经建立了多种多样的社交网络关系。我面临的问题是创建一个单一的图标,可以检测用户是否已经连接,如果他们是跟随图标,则应改为跟随图标。

这是一段代码,用于决定是否呈现哪种类型的图标(跟随者或跟随者)。

ConnectionHandle(Array, _id){
  return Array.map(function(el, index){
      console.log('chicken');
    if(el === User_id){
      return(
        <div className="btn btn-warning" onClick={() => this.props.disconnectUser({id: _id})}>- user</div>
      );
    } else {
      return (
        <div className="btn btn-info" onClick={() => this.props.connectUser({id: _id})}>+ user</div>
      );
    }
  },this);
};

以上代码将位于以下列表中:

return this.props.users.map(function(el, index){
    return (
      <li className="list-group-item" key={ index }>
        <Link to={`/users/${el._id}`} activeClassName="active">
         {el.email}
         <div className="pull-sm-right">Join on    {this.joinDate(el.createdAt)}</div>
         {this.entryNum(el.entries.length)}
         {this.userNum(el.followers.length)}
         <div>{el.follow.length} follows</div>
       </Link>
       {this.ConnectionHandle(el.followers, el._id)}
      </li>
    )
  }, this)
}

后端是用postman测试的,它在建立多对多关系时按预期工作。他们的关系也将用生命周期方法更新。

我只需要丢失的部分将图标从后面转换为后续,反之亦然。

0 个答案:

没有答案