Files
stack/packages/mosaic/framework/skills/vueuse-functions/references/createUnrefFn.md
T
fargo 1a822493ba format: apply repo prettier (3.8.1) to the folded skills tree
963 markdown files reformatted with the repository's pinned prettier so
pnpm format:check covers the folded tree like every other repo file.

The formatter's embedded-language pass also normalized code fences
(TS semicolons, closed HTML tags in examples, lowercased CSS hex colors,
one renumbered list that skipped an index). Alphanumeric token deltas vs
the fold commit were audited file-by-file; all are formatter-equivalent
markup normalizations plus the four sanitized skills.
2026-08-19 14:37:17 -05:00

1.3 KiB

category, related
category related
Utilities reactify

createUnrefFn

Make a plain function accepting ref and raw values as arguments. Returns the same value the unconverted function returns, with proper typing.

::: tip Make sure you're using the right tool for the job. Using reactify might be more pertinent in some cases where you want to evaluate the function on each changes of it's arguments. :::

Usage

import { createUnrefFn } from '@vueuse/core';
import { shallowRef } from 'vue';

const url = shallowRef('https://httpbin.org/post');
const data = shallowRef({ foo: 'bar' });

function post(url, data) {
  return fetch(url, { data });
}
const unrefPost = createUnrefFn(post);

post(url, data); /* ❌ Will throw an error because the arguments are refs */
unrefPost(url, data); /* ✔️ Will Work because the arguments will be auto unref */

Type Declarations

export type UnrefFn<T> = T extends (...args: infer A) => infer R
  ? (
      ...args: {
        [K in keyof A]: MaybeRef<A[K]>;
      }
    ) => R
  : never;
/**
 * Make a plain function accepting ref and raw values as arguments.
 * Returns the same value the unconverted function returns, with proper typing.
 *
 * @__NO_SIDE_EFFECTS__
 */
export declare function createUnrefFn<T extends Function>(fn: T): UnrefFn<T>;