useEffect 中的 ReactJS axios 调用显示 - 警告：函数作为 React 子项无效

Question

我正在尝试从我的 API 获取数据并将其存储到一个变量中，使用变量中的 setState 钩子进行反应。我的代码在这里

---

import { useState, useEffect } from 'react';
import axios from 'axios'
const rest_base = wpbpressdata.rest_url
const api = rest_base + '/services'

const ServicesCategory = () => {
    const [services, setServices] = useState(null)
    useEffect( () => {
        axios.get( api )
            .then( (res) =>{ 
                setServices(res.data) 
            })
    }, [] )
    return(
            services === null ? 'loading' : services.map = (data) => {
                <h3>{data.service_name}</h3>
            }
    )
}
export default ServicesCategory

但我收到这个错误Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.

Answer 1

{
 services === null ? 'Loading' : services.map(p => <h3>{p.service_name}</h3>)
}

调用map函数而不是赋值