# useEvaluation

Learn how to evaluate queries using composables.

This composable evaluates a [CQL query](/reference/cql/introduction) with full server-side rendering support. It uses Nuxt's `useAsyncData` under the hood, so the query is evaluated on the server during SSR and the result is hydrated on the client.

## Signature

This composable has the following signature:

```ts
function useEvaluation<T extends JsonValue>(
    query: string,
    options?: UseEvaluationOptions,
): AsyncData<T>;
```

## Example

Here is an example of how to use this composable:

**JavaScript**

```vue
<script setup>
const {data: isDeveloper} = await useEvaluation("user's persona is 'developer'");
</script>

<template>
  <a v-if="isDeveloper" href="/docs">View docs</a>
  <a v-else href="/share">Share with your developer</a>
</template>
```

**TypeScript**

```vue
<script setup lang="ts">
const {data: isDeveloper} = await useEvaluation<boolean>("user's persona is 'developer'");
</script>

<template>
  <a v-if="isDeveloper" href="/docs">View docs</a>
  <a v-else href="/share">Share with your developer</a>
</template>
```

## Parameters

- `query`: `string`

  The [CQL query](/reference/cql) to evaluate, with a maximum length of 500 characters.

- `options`: `object` (optional)

  The evaluation options.

  - `fallback`: `JSON` (optional)

    A fallback value to use in case of an error.

    If not specified, the `error` ref will contain the error and `data` will remain `null`.

  - `timeout`: `number` (optional)

    The maximum fetch time in milliseconds.

    Once reached, the SDK will abort the request and reject the promise with a timeout error.

  - `attributes`: `object` (optional)

    The map of attributes to inject in the evaluation context.

    The attributes can be referenced in audience conditions using the [`context`](/reference/cql/context#evaluation) variable. For example, suppose you pass the following attributes:

    ```json
    {cities: ["New York", "San Francisco"]}
    ```

    You can then reference them in queries like:

    ```cql
    context's cities include location's cityName
    ```

    For more information, see [Context variables](../../content-rendering#context-variables).

    The following restrictions apply to the attributes:

    - Up to 30 entries and 5 levels deep
    - Keys can be either numbers or non-empty strings with a maximum length of 50 characters
    - Values can be null, numbers, booleans, strings (up to 50 characters), or nested maps
    - Nested maps follow the same constraints for keys and values

## Return

The return is a Nuxt `AsyncData` object with the following properties:

- `data`: `Ref<T | null>`

  A ref containing the evaluation result, or `null` while loading.

- `pending`: `Ref<boolean>`

  A ref indicating whether the query is currently being evaluated.

- `error`: `Ref<Error | null>`

  A ref containing the error if the evaluation failed, or `null` otherwise.