TestQuery.js
e725383d8cf6drf-api-tracking

TestQuery.js
View Options

			import React from "react"
			import { useQuery} from "react-query"
			import {getJournal} from '../services/requests/Journal'
			import {getInstitution} from '../services/requests/Institution'
			import CircularProgress from '@material-ui/core/CircularProgress'
			import ErrorOutlineIcon from '@material-ui/icons/ErrorOutline';

			function TestQuery () {
			const instit_id = 4
			const journal_id = 8
			const sendGetRequest =
			async () => {
			try {
			const resp = await getInstitution(instit_id,1)
			console.log(resp.data);
			} catch (err) {
			// Handle Error Here
			console.error(err);
			}
			}



			const { isLoading, isError, data, error, isIdle, isFetching, refetch} = useQuery('checkInstit', sendGetRequest, {
			enable: false
			})


			const handleClickInstit = () => {

			// manually refetch
			// sendGetRequest()

			refetch()

			}






			return (
			<div>
			<h1>Query test</h1>
			<button onClick={handleClickInstit}>check instit</button>





			{isIdle ? (
			'Not ready...'
			) : isLoading ? (
			<span>< CircularProgress /></span>
			) : isError ? (
			<span><ErrorOutlineIcon /> {error.message}</span>
			) : (
			<>
			{data &&
			<h4>{data.data}</h4>
			}
			<div>{isFetching ? < CircularProgress /> : null}</div>
			</>
			)}
















			</div>
			)


			}

			export default TestQuery