javascript - 在 useEffect 中添加数组中的数字

Question

我正在尝试使用钩子(Hook)将数组中的数字添加在一起。目前它是一个投票系统。使用 map 语句添加所有数字的结果给了我 0。我很确定这与 useState 没有及时更新以添加数字有关，因此它总是给我零。我知道我可以将它们放在一个单独的数组中，然后添加它，但这对于看起来如此简单的东西来说似乎有点冗长。

这是我生成 0 的代码

const PollResultsContainer = (props) => {
    const option = props.option
    const [totalVotes, setTotalVotes] = useState(0)

    useEffect(() => {
        let newVote
        if (option.length > 0) {
            option.map(opt => {
                newVote = opt.optionVotes + totalVotes
            })
        }
        setTotalVotes(newVote)
    }, [totalVotes])
    console.log(totalVotes)
    return (
        <>
            <div className='poll-results-div'>
                <TitleCardNS title={`${totalVotes}`} size='2.5rem' align='center' color='white' />
            </div>

Answer 1

不需要将其存储在状态中。

const PollResultsContainer = ({option}) => {
  let totalVotes = option.reduce((acc, {optionVotes}) => acc + optionVotes, 0);
  console.log(totalVotes);
};