## Table of Contents

- [setData](#setdata)

---

[](https://microlink.io/docs/api/getting-started/overview)

[API](https://microlink.io/docs/api/getting-started/overview)

[](https://microlink.io/docs/guides)

GUIDES

[](https://microlink.io/docs/mql/getting-started/overview)

MQL

[](https://microlink.io/docs/sdk/getting-started/overview)

SDK

[](https://microlink.io/docs/cards/getting-started/overview)

CARDS

## setData

A data mapper that will be invoked before mounting the card.

When an \<object\> is passed to `setData`, the custom data provided will be merged with the original data.

```
<template>

  <Microlink

    url="https://www.instagram.com/p/BeV6tOhFUor/"

    :set-data="{ title: 'SENTRY ACTIVATED' }"

  />

</template>
```

The data provided will be merged with the original data extracted.

Additionally you can pass a \<function\> where in this case the first argument that received will be the data fetched using [fetchData](https://microlink.io/docs/sdk/parameters/fetch-data):

``` jsx
import Microlink from '@microlink/react'

<Microlink

  url='https://www.instagram.com/p/BeV6tOhFUor/'

  setData={data => ({

    ...data,

    title: 'SENTRY ACTIVATED',

    description: 'Are humans worth it?',

    image: { url: 'https://microlink.io/images/1FyFxlk.jpg' },

    publisher: 'HAL 9000',

    url: 'http://thehal9000.com'

  })}

/>
```

Skip internal fetch providing a function as setData.

The function should return all the data necessary to be mounted.