Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

162
Visualizações
js Tabulador desencadenar evento en la selección de casilla de verificación vue3js

Estoy usando Vue3 y Tabulator (5.2.7) para obtener una tabla de datos. Estoy usando la API de composición.

Estoy omitiendo un código irrelevante en los bits a continuación.

 //DataTable.vue <script setup> import { TabulatorFull as Tabulator } from 'tabulator-tables'; import { useDataStore } from '@/stores/DataStore.vue'; import { ref, reactive, onMounted } from 'vue'; const store = useDataStore(); //get data from state manager // this is as per the tabulator docs w/vue const table = ref(null); const tabulator = ref(null); const tableData = reactive(store.getData); onMounted(() => { tabulator.value = new Tabulator(table.value, { layout: "fitDataTable", data: tableData, reactiveLayout: true, responsiveLayout: true, selectable: 1, // be able to select only 1 row at a time columns: [ {formatter: "rowSelection", titleFormatter: "rowSelection", headerSort: false, cellClick: function(e, cell) { const r = cell.getRow(); console.log(r._row.data); } // some more data but its just regular title/field assoc. ] } } </script> <template> <div ref="table"></div> </template>

Desafortunadamente no puedo compartir capturas de pantalla, pero tengo una imagen: ingrese la descripción de la imagen aquí

Entonces, lo que quiero que suceda es que cuando marque la casilla de verificación (área roja), la consola registrará los datos (y eventualmente hará otras cosas). Cuando hago clic en el área verde (resto de la celda), lo hace, además de seleccionar la fila. Cuando hago clic en la casilla de verificación, no lo hace. La fila está seleccionada, pero no registra ni activa ninguna función.

He intentado pasar los detectores de eventos y las devoluciones de llamada documentados ( http://tabulator.info/docs/5.2/events#row ), pero cada vez que intento hacer un table.on() , como table.on("rowDblClick", () => {return 1}) me da un error de que table.on no es una función, y los detectores de eventos de fila se eliminaron en 5.0.

La única razón por la que estoy usando Tabulator es porque Vuetify aún no funciona con Vue3 (todavía está en versión beta, si mal no recuerdo), y encontré esto en mis búsquedas de Google.

EDITAR: Alternativamente, si alguien sabe cómo hacer que funcionen los detectores de eventos incorporados o los parámetros de devolución de llamada de rowClick , esa sería una solución aceptable.

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda