title: Importing a function in Vue 3 setup
body: <p>Currently, im trying to call a throttle/debounce function in my Vue component, but every time it's called a <code>Uncaught TypeError: functionTD is not a function</code> si throw here is my code.</p>
  <p><code>useThrottleDebounce.ts</code></p>
  <pre><code>import { debounce, throttle } from &quot;lodash&quot;;
  import { ref, watch } from &quot;vue&quot;;
  
  export const useThrottleDebounce = (tTime = 2000, dTime = 1000) =&gt; {
    const tRef = ref&lt;any&gt;(null);
    const tFunc = ref&lt;any&gt;(null);
    const tDHook = ref&lt;any&gt;(null);
  
    const debounceThrottle = debounce(() =&gt; {
      if (tRef.value) {
        tRef.value.cancel();
      }
      tRef.value = throttle(tFunc.value, tTime)();
    }, dTime);
  
    const throttleDebounceCreator = () =&gt; {
      return (func: any) =&gt; {
        tFunc.value = func;
        debounceThrottle();
      };
    };
  
    watch(() =&gt; tDHook.value, () =&gt; {
      tDHook.value = throttleDebounceCreator();
    });
  
    return tDHook;
  };
  
  export default useThrottleDebounce;
  </code></pre>
  <p>and this is when it's called inside <code>setup</code> in my component</p>
  <pre><code>setup(){
     // some code
     const functionTD = useThrottleDebounce(2000, 500);
     const inc = () =&gt; {      
        functionTD (() =&gt; {     
          count.value++; // here throw error
        });
      };
  }
  </code></pre>