状态值不会在第一次单击时更新，而是在第二次单击时更新

Question

我试图在我的第一次点击时更新状态值，

 const [Rating,setRating] = useState(0)

     const onRate = (nextValue, prevValue, name) => {

        setRating(nextValue)

        let variable = {
            productId:props.productId,
            userId:user._id,
            noOfStars:Rating
        };

        console.log(variable)
    }

  return(
           <div>
                  <h2>Rating from state: {Rating}</h2>

                                <StarRatingComponent
                                    name="rate1"
                                    starCount={5}
                                    size="5"
                                    value={Rating}
                                    onStarClick={onRate}
                                />
                            </div>)

我显示的代码经过此过程，当用户单击使用StarRatingComponent渲染的星星时，将执行onStarClick方法。根据所使用的软件包，在何处提供变量 nextValue ，以通过 setRating（nextValue）设置新的Rating。当我在第一个实例上单击星号时，在第二个实例上传递的初始值为0，仅传递正确的值。我希望能够在第一个实例上传递该值。我的代码需要更改什么？

Package I have used