在状态为Array的情况下将此this.state转换为useEffect

Question

这里的新手，将带有构造函数的基于类的组件转换为带有Hooks的函数组件时，我一无所获。

我有this.state，其中填充了我从Firebase获得的数组。

这很好：

class MyList extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      users: []
    };
  }

  componentDidMount() {
    db.collection("users")
      .get()
      .then(querySnapshot => {
        const data = querySnapshot.docs.map(doc => doc.data());
        console.log(data);
        this.setState({ users: data });
      });
  }

  render() {
    const { users } = this.state;
    return (
      <>
        {users.map(user => (
            <p>A mapped item</p>
        ))}
      </>
    );
  }
}

不幸的是，我无法正确进行转换，已经进行了数小时，而且我必须遇到一些概念上的问题：

function MyList() {
  const [users, setUsers] = useState([]);
  
  useEffect(() => {
    db.collection("users")
    .get()
    .then(querySnapshot => {
      const data = querySnapshot.docs.map(doc => doc.data());
      console.log(data);
      setUsers({ users: data })
    });
    }, [setUsers]);

    return (
      <>
        {users.map(user => (
            <p>A mapped item</p>
        ))}
      </>
    );
  }

任何帮助将不胜感激-请新手友好：）