I am new to react and trying to fetch data using axios but its not working, can I use async/await syntax in the useEffect hook?
./api/index.js
import axios from 'axios'
const url = 'http://localhost:5000/posts'
export const getPosts = async ()=>{
const data = await axios.get(url).data
return data
}
export const createPost = async (data)=>{
const result = await (await axios.post(url, data)).data
return result
}
Post.js
import React, { useEffect, useState } from 'react'
import { getPosts } from '../api'
export const Post = () => {
const [post, setPost] = useState([])
useEffect(()=>{
setPost(getPosts().then(data=>data))
console.log(post)
}, [])
return (
<>
POSTS
</>
)
}
export default Post
App.js
import React from 'react'
import { useEffect } from 'react'
import { getPosts } from './api'
import Form from './components/Form'
import Post from './components/Post'
const App = () => {
useEffect(()=>{
const data = getPosts()
console.log(data)
})
return (
<>
<Form/>
<Post/>
<div>App</div>
</>
)
}
export default App
I want to console.log the data as well as use the data in the setPost hook to change the value of the post