axios.get first time response is empty using useState and useEffect

by

I dont know why first time response is empty, I have tried several ways, using loading and without , using ... thing also. can someone help me out what am I doing wrong ? No idea even why I get console 2 or 3 times even [here is my console][1]

    const Product = (props) => {
        const artikeId = props.match.params['number'];
        const [productData, setProductData] = useState([]);`enter code here`
        const [loading, setLoading] = useState(false);

        useEffect( () => {
            const fetchData = async () => {
                await axios.get(`http://localhost:8081/products/${artikeId}`)
                    .then(res => {
                        setProductData(res.data)
                        setLoading(true)
                        //    setProductData([...productData,res.data]);
                    })
            };
            fetchData();
        }, []);

        console.log(productData)

        return <div>
If it works I will return {productData[0].name} etc etc
        </div>
    }
    export default Product```


  [1]: https://i.stack.imgur.com/U58JI.png

18 thoughts on “axios.get first time response is empty using useState and useEffect”

Leave a Comment