I am trying to know what problem with me. I have this state

    const [selectedTags, setSelectTags] = useState([])
    const initSelectedTag = useRef(false)

Then I am using useEffect to detect this state change then call API:

useEffect(() => {
        console.log('selectedTags', selectedTags)
        if (initSelectedTag.current == false) { //avoid first time useEffect call API
            initSelectedTag.current = true
            return
        }
        searchPost(textRef.current)
    }, [selectedTags])

const renderTag = () => {
        if (tags.length == 0) {
            return null
        }
        return <>
            <div className="home-tag-search-content" style={{
                borderColor: 'red',
                color: 'red',
                minWidth: 0
            }} onClick={() => {
                setSelectTags([])
            }}>X</div>
           ...
          </>

}

Each time click to above div (home-tag-search-content), I still see that log on useEffect like below: