Vue.js - element-plus - el-table-v2 - How to have a link in a cell with href containing cell value?

I'm using vue.js and a virtualized table from element-plus. I want to have one of the columns to be a clickable link, href of which contains the data from the cell.

Table template:

<template>
   <div>
      <el-table-v2
         :columns="columns"
         :data="data"
         :row-class="rowClass"
         :width="700"
         :height="400"
       />
   </div>
</template>

Columns definition:

 const columns = [
  {
    key: 'instance_id',
    title: 'instance_id',
    dataKey: 'instance_id',
    cellRenderer: ({ cellData: instance_id}) =>
        <ElLink v-bind:href="'https://url.base.net/index.php?/view/' + instance_id" target="_blank">{instance_id}</ElLink>
  },
  ...
]

Besides using ElLink I've tried:

<a v-bind:href="'https://url.base.net/index.php?/view/' + instance_id" target="_blank">{instance_id}</a>

But neither works. Using just href instead of v-bind:href works, but it does not allow passing cell value (instance_id) into the URL to navigate to.

Can someone advise if there is a way to achieve what I'm trying to achieve? - have a cell in a table that is a clickable link, URL to navigate to of which contains the data from the cell.

Have you tried this?

href={'https://url.base.net/index.php?/view/'+instance_id}

When rendering, just splice the strings directly.