reactjs - ReactQuery から useQuery フックを使用して状態を更新する方法は?

Question

import React, {useState, useEffect, Component} from 'react';
import {Grid, Paper, TextField} from '@material-ui/core'
import DataManager from './../data_manager/data_manager'

const dataManager = new DataManager();

const Tile = (props)=>{
    // Initializing State Variables
    const [state, setState] = useState({
        data : {}
    })

    const { status, data, error, isFetching } = useQuery("data",async()=>{
        const res = await fetch("localhost:8000");
        return res.json()
    }

    if(status==="success"){
        setState({data})
    }else{
        return(<p>Doing</p>)
    }
}

このコードは、レンダリングがループで継続する無限ループを引き起こします。

setState によって useQuery が再度実行され、状態が再度設定されるためだと思います。

どんな助けでも大歓迎です。useQuery から取得したデータを状態変数に格納したいと考えています。

ティア。