Question

我知道在Angular中有ngOnInit。在Reactjs中，加载页面时是否有类似的操作来获取请求？

我有一个表，我在加载页面时需要获取请求以在表中显示数据。

API

Answer 1

通常在useEffect钩子内部完成组件的数据获取

export default function ListAdverts() {
    const columns = ...

    const [dataAdverts, setdDataAdverts] = React.useState([]);

    // fetch data here
    // runs only once because of empty dependency array
    React.useEffect(() => { 
      let isCancelled = false

       const fetchSomeData = async () => {
          const data = await someApiRequest()

          // only update state if component isn't unmounted
          // if you try to update state on an unmounted component,
          // React will throw an error
          if (!isCancelled) {
             setdDataAdverts(data)
          }
       }
       fetchSomeData()

       // cleanup
       return () => {
         isCancelled = true
       }
    }, [])

    return (
        <Table
            rows={dataAdverts}
            columns={columns}
        />
    )
}

Reactjs-加载页面时发出get请求

1 个答案: