<div id="readability-page-1" class="page"><div>
      
        <header>
          
          

  <p>
    

    

    
      
      

      <span>
        
        
          less than 1 minute read
        
      </span>
    
  </p>


        </header>
      

      <section itemprop="text">
        
        <p><a href="https://tanstack.com/query/latest">tanstack query</a> (구 react-query)의 useQuery 훅을 사용할 때, enabled: false 설정은 초기 쿼리 실행을 막는 옵션입니다. 그런데 refetch()와 함께 사용하면 어떻게 될까요?</p>

<h2 id="핵심-요약">핵심 요약</h2>
<ul>
  <li>enabled: false는 쿼리가 자동 실행되지 않도록 합니다.</li>
  <li>하지만 refetch()는 강제로 쿼리를 수동 실행하므로, enabled: false와는 별개로 동작합니다.</li>
  <li>따라서 <b>enabled: false여도, refetch()를 호출하면 HTTP 요청이 발생합니다.</b></li>
</ul>

<h3 id="예시">예시</h3>

<div><pre><code><span>const</span> <span>{</span> <span>data</span><span>,</span> <span>refetch</span> <span>}</span> <span>=</span> <span>useQuery</span><span>(</span>
  <span>[</span><span>'</span><span>myData</span><span>'</span><span>],</span>
  <span>fetchData</span><span>,</span>
  <span>{</span>
    <span>enabled</span><span>:</span> <span>false</span><span>,</span>
  <span>}</span>
<span>);</span>

<span>// 어떤 버튼 클릭 시 수동으로 요청 보냄</span>
<span>&lt;</span><span>button</span> <span>onClick</span><span>=</span><span>{</span><span>()</span> <span>=&gt;</span> <span>refetch</span><span>()</span><span>}</span><span>&gt;</span>불러오기<span>&lt;/</span><span>button</span><span>&gt;</span>
</code></pre></div>

<h3 id="참고-refetch의-동작">참고: refetch()의 동작</h3>
<ul>
  <li>refetch()는 enabled와 관계없이 강제 실행입니다.</li>
  <li>내부적으로 queryClient.fetchQuery()를 호출하는 것과 유사하게 작동합니다.</li>
</ul>

<p>20250401</p>

        
      </section>

      

      


      
  


    </div></div>

Never test

tanstack query (구 react-query)의 useQuery 훅을 사용할 때, enabled: false 설정은 초기 쿼리 실행을 막는 옵션입니다. 그런데 refetch()와 함께 사용하면 어떻게 될까요?
핵심 요약
enabled: false는 쿼리가 자동 실행되지 않도록 합니다.
하지만 refetch()는 강제로 쿼리를 수동 실행하므로, enabled: false와는 별개로 동작합니다.
따라서 enabled: false여도, refetch()를 호출하면 HTTP 요청이 발생합니다.
예시
const { data, refetch } = useQuery(
  ['myData'],
  fetchData,
  {
    enabled: false,
  }
);
// 어떤 버튼 클릭 시 수동으로 요청 보냄
<button onClick={() => refetch()}>불러오기</button>
참고: refetch()의 동작
refetch()는 enabled와 관계없이 강제 실행입니다.
내부적으로 queryClient.fetchQuery()를 호출하는 것과 유사하게 작동합니다.
20250401

tanstack query의 refetch는 강제 request 수행이다

댓글