# Persist

With `persist` keyword, you can make changes on form persistent. This can be useful when you want to preserve prop values on browser refreshes, share filled form as link, share some filter settings etc. 

| Keyword  | Type                        |                                                                                                                                                                    |
| -------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| type     | `'query'`, `'localStorage'` | What type of storage to use.                                                                                                                                       |
| key      | `string` (optional)         | <p>Under what key to store value. If not set prop path is used.</p><p></p><p>For example <code>key: 'abc'</code> will be set in query as <code>?abc=123</code></p> |
| loadMap  | `$eval` (optional)          | Mapper when retrieving the data from the persistence.                                                                                                              |
| storeMap | `$eval` (optional)          | Mapper when storing the data to persistence.                                                                                                                       |

### Example

When prop value is changed it will be also saved into URL under query key `my-key`. When the form is opened again URL query will be checked if the value can be retrieved.

```typescript
{
    type: 'string',
    persist: {
        type: 'query',
        key: 'my-key'
    }
}
```

{% hint style="info" %}
Persist has priority before default and advancedDefault.
{% endhint %}

### Array edge cases

You can not use persists on array prop children, since all children will have the same key. Exception is a static array where you can manually set different keys. But you can easily set persist on array level or parent object.

{% hint style="danger" %}
**Wrong**

All array items will have same key, this is probably not what you need.

```typescript
{
    type: 'array',
    items: {
        type: 'string',
        persist: { type: 'localSTorage' }
    }
}
```

{% endhint %}

{% hint style="success" %}
**Correct**

If you need to make array persistent, set `persist` keyword on array level.

```typescript
{
    type: 'array',
    persist: { type: 'localSTorage' },
    items: {
        type: 'string'
    }
}
```

{% endhint %}

{% hint style="success" %}
**Correct**

If you have static array, you can set your own keys for items in that case storage is stable.

```typescript
{
    type: 'array',
    items: [
        {
            type: 'string', 
            persist: { type: 'localSTorage', key: 'my-1' },
        },
        {
            type: 'string', 
            persist: { type: 'localSTorage', key: 'my-2' },
        }
    ]
}
```

{% endhint %}