我坚持不更新 react useState hook setPosition(lonLat) 第 34 行。有人可以告诉我为什么这不起作用吗？位置 const 仍然是一个“测试”字符串。

import 'ol/ol.css'
import Map from "ol/Map"
import OSM from "ol/source/OSM"
import Tile from "ol/layer/Tile"
import View from "ol/View"
import {fromLonLat, toLonLat} from 'ol/proj'

export const useMap = () => {
    const [position, setPosition] = useState('test')

    useEffect(() => {
        // initialMap
        const initialMap = new Map({
            target: "map",
            layers: [
                new Tile({
                source: new OSM(),
                }),
            ],
            view: new View({
                center: fromLonLat([15, 50]),
                zoom: 8,
            }),
        })
        
        // pick up coordinates
        initialMap.on('click', (e) => {
            const coordinate = e.coordinate
            const lonLat = toLonLat(coordinate)

            // I cant understand, why the next setPosition(lonlat) does not update the cosnt position
            setPosition(lonLat)
            console.log(position)
        })
        
    }, [position]);
    

    return { position }
};```