# setData

Type:

\<object\> \| \<function\>

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.

-

  React



-

  Vue



-

  Jekyll



-

  Vanilla



    <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.

[](https://www.instagram.com/p/BeV6tOhFUor/)

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):

    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.

[](https://www.instagram.com/p/BeV6tOhFUor/)