我需要做用户卡，点击跟随按钮，它改变颜色和名称，并添加1以下.我收到这样的用户从API，12用户，我需要能够选择多个1用户，我怎么能做到这一点，我想不出来.
但是我不明白如何标记按钮以记录在商店中我的代码在那里我提出一个请求。然后我将其记录在“用户”中，并通过map，我渲染所有的卡

export const UserList = () => {
  const [users, setUsers] = useState([]);
  const [userId, setUserId] = useState(null);
  const [page, setPage] = useState(2);

  const getUsersFromAPI = async () => {
    const user = await fetchUsers();
    setUsers(user);
  };

  const fetchNextPage = async () => {
    setPage(prevPage => prevPage + 1);
    const usersNext = await nextPageUsers(page, 3);
    setUsers(prevUser => [...prevUser, ...usersNext]);
    if (page === 4) {
      setPage(1);
      await nextPageUsers(page, 3);
      return;
    }

    return usersNext;
  };

  useEffect(() => {
    getUsersFromAPI();
  }, []);

  
# const followind = (id, e) => {
# 
# const userIdx = users.findIndex(user => user.id === id);
# 
# if (userId === id) {
# setUserId(null);
# users[userIdx].followers--;
# 
# return;
#     }
# 
# setUserId(id);
# users[userIdx].followers++;
#   };

  return (
    <div>
      {users && (
        <ul className={css.list}>
          {users.map(user => {
            return (
              <li key={user.id} className={css.containerItem}>
                <div className={css.space}>
                  <button type="button" className={css.imageLogo}></button>
                  <div className={css.upperPart}></div>
                  <div className={css.middleLine}>
                    <img
                      className={css.userFoto}
                      src={user.avatar}
                      alt={user.name}
                    ></img>
                  </div>
                  <div className={css.lowerPart}>
                    <p className={css.ps}> {user.tweets} Tweets</p>

                    <p className={css.ps}>
                      {' '}
                      {user.followers.toLocaleString('en-US')}
                      Followers
                    </p>

                    ***<button
                      id={user.id}
                      className={
                        userId === user.id ? css.btnPress : css.btnFollow
                      }
                      type="button"
                      onClick={e => followind(user.id, e)}
                    >
                      {userId === user.id ? 'Following' : 'Follow'}
                    </button>***
                  </div>
                </div>
              </li>
            );
          })}
        </ul>
      )}
      {page <= 4 && (
        <button type="button" onClick={fetchNextPage}>
          Next
        </button>
      )}
    </div>
  );
};```