I’m trying to make a button in a datatable redirect to a view, but doesn’t recognize the function. I tried using the export default and create a method there is an error saying ” cannot contain ES module exports. If you are using a previous version of , please consult the updated RFC at https://github.com/vuejs/rfcs/pull/227.”

<script setup lang="ts">
import DataTable from 'datatables.net-vue3';
import DataTablesCore from 'datatables.net-bs5';
import 'bootstrap/dist/css/bootstrap.min.css';
DataTable.use(DataTablesCore);
const id_seller=1;
const columns = [
  { data: 'id' },
  { data: 'name' },
  { data: 'city' },
  { data: 'job' },
  { data: 'civil' },
  { data: 'last_call' },
  { data: 'last_visit' },
  {
    data: null, // this can be any valid data source field, but it won't be used directly
    render: function(data, type, row) {
      return ' <button class="btn btn-info" @click="details">Details</button>';
    }
    /*render: function(data, type, row) {
      return `<a href="/contacts/${row.id}" class="btn btn-primary">View</a>`;
    }*/
  }
];

function back(id) {
  alert("clicked")
  const router =this.$router.push('/contact/'+id)
}

</script>

<template>
  <div class="container">
    <h1>Royal Prestige New York SR</h1>

    <DataTable
        :columns="columns"
        :ajax="{
          url: 'http://localhost:8080/contacts/seller?id='+id_seller, // URL to fetch data from backend
          dataSrc: '' // If the data source is not nested in an object, set it to empty string
        }"
        class="table table-hover table-striped"
    >
      <thead>
      <tr>
        <th>Id</th>
        <th>Name</th>
        <th>City</th>
        <th>Civil Status</th>
        <th>Job</th>
        <th>Last Call</th>
        <th>Last Visit</th>
        <th>Option</th>
      </tr>
      </thead>
    </DataTable>
  </div>
</template>

<style>
@import 'datatables.net-bs5';

.container {
  width: 300%;
}
</style>